Код вашей страницы

 <html>
<head>
<style type="text/css">
a.one:link {color:#ff0000;}
a.one:visited {color:#0000ff;}
a.one:hover {color:#ffcc00;}

a.two:link {color:#ff0000;}
a.two:visited {color:#0000ff;}
a.two:hover {font-size:150%;}

a.three:link {color:#ff0000;}
a.three:visited {color:#0000ff;}
a.three:hover {background:#66ff66;}

a.four:link {color:#ff0000;}
a.four:visited {color:#0000ff;}
a.four:hover {font-family:monospace;}

a.five:link {color:#ff0000;text-decoration:none;}
a.five:visited {color:#0000ff;text-decoration:none;}
a.five:hover {text-decoration:underline;}
</style>
</head>

<body>
<p>Поводите мышью над ссылками, чтобы увидеть изменение стиля ссылок.</p>

<p><b><a class="one" href="css_examples.html" target="_blank">Эта ссылка меняет цвет.</a></b></p>
<p><b><a class="two" href="css_examples.html" target="_blank">Эта ссылка меняет размер шрифта.</a></b></p>
<p><b><a class="three" href="css_examples.html" target="_blank">Эта ссылка меняет фон.</a></b></p>
<p><b><a class="four" href="css_examples.html" target="_blank">Эта ссылка меняет тип шрифта.</a></b></p>
<p><b><a class="five" href="css_examples.html" target="_blank">Эта ссылка меняет оформление текста.</a></b></p>
</body>

</html>

Результат в окне браузера

Поводите мышью над ссылками, чтобы увидеть изменение стиля ссылок.

Эта ссылка меняет цвет.

Эта ссылка меняет размер шрифта.

Эта ссылка меняет фон.

Эта ссылка меняет тип шрифта.

Эта ссылка меняет оформление текста.

К примерам CSS >> В раздел CSS >> На главную >>