Heim >Web-Frontend >CSS-Tutorial >Fügen Sie Hyperlinks andere Stile_CSS/HTML hinzu

Fügen Sie Hyperlinks andere Stile_CSS/HTML hinzu

PHP中文网
PHP中文网Original
2016-05-16 12:12:261682Durchsuche

Hyperlinks zusätzliche Stile hinzufügen

<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>Mouse over the links to see them change layout.</p> 

<p><b><a class="one" href="default.asp" target="_blank">This link changes color</a></b></p> 
<p><b><a class="two" href="default.asp" target="_blank">This link changes font-size</a></b></p> 
<p><b><a class="three" href="default.asp" target="_blank">This link changes background-color</a></b></p> 
<p><b><a class="four" href="default.asp" target="_blank">This link changes font-family</a></b></p> 
<p><b><a class="five" href="default.asp" target="_blank">This link changes text-decoration</a></b></p> 
</body> 

</html>

Machen Sie die erste Textzeile zu etwas Besonderem

<html> 
<head> 
<style type="text/css"> 
p:first-line  
{ 
color: #ff0000; 
font-variant: small-caps 
} 
</style> 
</head> 

<body> 
<p> 
You can use the :first-line pseudo-element to 
 add a special effect to the first line of a text! 
</p> 
</body> 

</html>
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn