首页  >  文章  >  web前端  >  CSS伪元素_html/css_WEB-ITnose

CSS伪元素_html/css_WEB-ITnose

WBOY
WBOY原创
2016-06-24 11:43:41786浏览

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title></title>    <style>        p:first-line {  /*伪元素: 本来p元素的第一行是一句文字,并不是一个元素,但是这里将p元素的第一行伪装成一个元素了,然后给它设置样式; */            font-size:30px;            font-family:Arial;            color:red;        }        p:first-letter { /*这里将p标签这个元素的第一个字母伪装成一个元素,然后给他设置样式*/            font-size:3cm;        }        :root { /*将样式绑定到页面的根元素中,所有根元素是指位于文档中最顶层结构的元素,即<html> 即将HTML的背景设置为黄色*/            background-color:yellow;        }           </style></head><body>    <p>        Aaaaaaaaaaa<br/>        bbbbbbbbbbb<br />        ccccccccccc<br />    </p></body></html>

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title></title>    <style>            p:before {  /*在p元素前面追加一个“你好”文字*/            content:"你好!";                    }        p:after { /*在p元素后面追加一个“大家好”文字*/            content:"大家好!"        }              </style></head><body>    <p>        Aaaaaaaaaaa    </p></body></html>


声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn