h2:before{ content:"前缀"; } h2:after{ content:"后缀"; }
B . 指定个别的元素不进行插入
h2.sample:before{ content:none; }
2. 插入图像
A . 在标题前插入图像文件
h2:before{ content:url(anwy.jpg); }
B . 将 alt 属性的值作为图像的标题来显示(用不了)
img:after{ content:attr(alt); display:block; text-align:center; margin-top:5px; font-size:11px; font-weight:bold; color:black; }
3. 插入编号
A . 多个标题前加入连续编号
p:before{ content:counter(pCounter); } p{ counter-increment:pCounter; }
B . 在项目符号中追加文字
p:before{ content:"第"counter(pCounter)"段"; }
C . 指定编号样式、种类
p:before{ content:counter(pCounter,upper-alpha)'.'; color:blue; font-size:16px; }
D . 编号嵌套
p:before{ content:counter(pCounter,upper-alpha)'.'; color:blue; font-size:16px; } p{ counter-increment:pCounter; counter-reset:subDivCounter; } p:before{ content:counter(subDivCounter)'.'; margin-left:15px; font-size:12px; } p{ counter-increment:subDivCounter; }
E . 字符串两边添加文字嵌套符号
h3:before{ content: open-quote; } h3:after{ content: close-quote; } h3{ quotes:"【""】"; }
disc 点 | circle 圆圈 | square 正方形 | decimal 数字 | decimal-leading-zero 十进制数 | lower-roman 小写罗马文字 | upper-roman 大写罗马文字 | lower-greek 小写希腊字母 | lower-latin 小写拉丁文 | upper-latin 大写拉丁文 | armenian 亚美尼亚数字 | georgian 乔治亚数字 | lower-alpha 小写 英文字母 | upper-alpha 大写 英文字母 | none 无 | inherit 继承
以上就是怎么在css3在页面中插入内容的详细内容,更多请关注Gxl网其它相关文章!
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://www.haodehen.cn/did72623