Heim >Web-Frontend >HTML-Tutorial >W3School-CSS 伪元素 (Pseudo-elements) 实例_html/css_WEB-ITnose
W3School-CSS 伪元素 (Pseudo-elements) 实例_html/css_WEB-ITnose
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal
- 2016-06-24 11:28:391439Durchsuche
CSS 伪元素 (Pseudo-elements)实例
CSS 实例
01制作首字母特效
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>01制作首字母特效</title> <style type="text/css"> p:first-letter { color: #ff0000; font-size: xx-large; } </style> </head> <body> <p> You can use the :first-letter pseudo-element to add a special effect to the first letter of a text! </p> </body></html> 02制作首行特效
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>02制作首行特效</title> <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> CSS 伪元素 (Pseudo-elements) 总结
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
Vorheriger Artikel：W3School-CSS 伪类 (Pseudo-classes) 实例_html/css_WEB-ITnoseNächster Artikel：使用float属性布局时父元素高度不能自适应的解决方法_html/css_WEB-ITnose