|
伪元素选择器： 1.first-line：用于向某个元素中的第一行文字使用样式 2.first-letter：用于向某个元素中的文字的首字母或第一个字母使用样式 3.before：用于在某个元素之前来插入一些内容 4.after：用于在某个元素之后来插入一些内容 - <!DOCTYPE html>
- <html>
- <head lang="en">
- <meta charset="UTF-8">
- <title>结构性伪类选择器</title>
- <style>
- /*修饰p元素下的第一行，改变样式*/
- p:first-line {
- color: chartreuse;
- }
- /*修饰p元素下的第一个字母，改变样式*/
- p:first-letter {
- color: brown;
- }
- /*在li元素之前插入一些内容*/
- li:before {
- content: '--';
- }
- /*在li元素之后插入一些内容*/
- li::after {
- content: '对列表做一个解释';
- font-size: 10px;
- color: dimgray;
- }
- </style>
- </head>
- <body>
- <p>这是在第一行的内容<br/>这里则是第二行的内容</p>
- <ul>
- <li>列表1</li>
- <li>列表2</li>
- <li>列表3</li>
- <li>列表4</li>
- <li>列表5</li>
- </ul>
- </body>
- </html>
| 
发表于 2015-12-30 18:24:55