--->mytest01.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>aの文字を挿げ替える</title>
<link rel="stylesheet" href="mytest01.css">
</head>
<body>
<p>個人情報の取り扱いについては、<a href="#"> プライバシーポリシー</a>をご覧ください</p>
<span class="nomal">普通の時</span>
<span class="hover">ホバーされたとき</span>
</a>
</p>
<script src="selector.js"></script>
</body>
</html>
--->mytest01.css
@charset "UTF-8";
body{
background:#ffe;
}
a{
color:#F00;
text-decoration: none;
}
/* 通常時はホバー時の文字を非表示にする */
a .hover{
display: none;
}
/* ホバー時は通常時の文字を非表示にする */
a:hover .nomal{
display: none;
}
/* ホバー時に、ホバー時の文字を表示する */
a:hover .hover{
display: inline;
color:#0F0;
}
