HTML&CSS基础-伪元素选择器
作者：尹正杰
版权声明：原创作品，谢绝转载！否则将追究法律责任。
一.html源代码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>伪元素</title> <style> /** * 伪元素选择器: * 使用伪元素来表示元素中的一些特殊的位置，对于IE6来说都是不支持的，要慎用哟~ * * * 给段落定义样式: * :first-letter * 给首字母 * :first-line * 给首行 * :before * 表示元素最前边的部分 * :after * 表示元素最后边的部分 */ /** * 让p元素第一个字符颜色变红，字体大小设置为20px */ p:first-letter{ color: red; font-size: 20px; } /** * 为p元素的第一行设置一个背景颜色为"黄色" */ p:first-line{ background-color: yellow; } /** * 一般before都需要结合conten这个样式一起使用，通过content可以向before或after的位置添加一些内容 */ p:before{ content: "我会出现再整个段落的最前边"; } /** * 一般after都需要结合conten这个样式一起使用，通过content可以向before或after的位置添加一些内容 */ p:after{ content: "我会出现在整个段落的最后边"; color: orange; } </style> </head> <body> <p> 1925年，鲁迅在北京担任大学讲师期间，因支持学生运动而受到当时所谓“正人君子”的流言攻击和排挤。1926年，北洋军阀政府枪杀进步学生，制造“三·一八”惨案。作者鲁迅写下《纪念刘和珍君》等一系列文章，热情支持学生的正义斗争，控诉北洋军阀政府的残暴，结果遭到当局的通缉而不得不远走厦门避难。《朝花夕拾》中的作品虽然都是在追忆往事，但也是“借题发挥”，影射、讥讽当时的社会现实。 </p> <p> 民国二十五年（1936年）1月，肩及肋骨皆出现剧痛，最后的创新之作《故事新编》出版。2月，开始续译《死魂灵》第二部。5月15日再发病，医生诊断胃疾，自后发热未愈，5月31日，史沫特黎女士引美国邓医生来诊断，情况不乐观。6月，身体略有好转，鲁迅及身边的人都认为“鲁迅先生好了”。10月17日旧病复发，18日黎明前疾病发作，气喘不止。10月19日上午5时25分逝世。 </p> </body> </html>
二.浏览器打开以上代码渲染结果
