Maison >interface Web >tutoriel HTML >W3School-CSS 伪元素 (Pseudo-elements) 实例_html/css_WEB-ITnose
W3School-CSS 伪元素 (Pseudo-elements) 实例_html/css_WEB-ITnose
- WBOYoriginal
- 2016-06-24 11:28:391413parcourir
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) 总结
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：W3School-CSS 伪类 (Pseudo-classes) 实例_html/css_WEB-ITnoseArticle suivant：使用float属性布局时父元素高度不能自适应的解决方法_html/css_WEB-ITnose