13518219792
这篇文章运用简单易懂的例子给大家介绍如何利用css3在选择器中的页面中插入所需内容 ，代码非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。
成都创新互联公司专注为客户提供全方位的互联网综合服务，包含不限于成都网站制作、做网站、玛多网络推广、微信平台小程序开发、玛多网络营销、玛多企业策划、玛多品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等，从售前售中售后，我们都将竭诚为您服务，您的肯定，是我们最大的嘉奖；成都创新互联公司为所有大学生创业者提供玛多建站搭建服务，24小时服务热线：18982081108，官方网址：www.cdcxhl.com
使用after或before选择器，在选择器的content属性中定义要插入的内容，当插入内容为文字的时候，必须要在插入文字的两旁加上单引号或者双引号。
使用content属性的none属性值
在content属性中通过指定“attr（属性名）”的形式 ，可以将某个属性的属性值显示出来。
img:after{
content:attr(alt);
display:block;
text-align:center;
}1、在content属性中使用counter属性值来针对多个项目追加连续编号
<元素>：before{ content：counter（计数器名）；}（使用计数器来计算编号，计数器可任意命名）
2、还需要在元素的样式中追加对元素的counter-increment属性的指定，为了使用连续编号，需要将counter-increment属性的属性值值设定为before选择器或after选择器的counter属性值中所指定的计数器名。
<元素>{ counter-increment：before选择器或after选择器中指定的计数器名 }
h2：before｛content：counter（mycounter）；｝ h2｛counter-increment：mycounter；｝//1、2、3.......
h2：before｛content：‘第’counter（mycounter）‘章’；｝//第1章大标题、第2章大标题.........
1.用before选择器或after选择器的content属性，不仅可以追加数字编号，还可以追加字母编号或罗马数字编号。
content：counter（计数器名，编号种类）
2.可以使用list-style-type属性的值来指定编号的种类，如大写字母编号时，使用 “upper-alpha”属性，指定大写罗马字母时用“upper-roman”属性。
h2：before｛content：counter（mycounter，upper-alpha）‘.’；｝// A.、B.、C.、
h2：before｛content：counter（mycounter）；｝//1（1、2、3...）、2（1、2、3...）、........ h2｛counter-increment：mycounter；counter-reset:subcounter;｝(将中编号进行重置) h3：before｛content：counter（subcounter）；｝ h3｛counter-increment：subcounter；margin-left:40px｝
h3：before｛content：counter（mycounter）‘-’ counter（subcounter）‘.’；｝//1-1、1-2
1、可以使用content属性的open-quote属性值与close-quote属性值在字符串两边添加诸如括号、单引号、双引号之类的嵌套文字符号。
2、open-quote属性值用于添加开始的嵌套文字符号，close-quote属性值用于添加结尾的嵌套文字符号。
3、在元素的样式中使用quotes属性来指定使用什么嵌套文字符号
h2:before{ content:open-quote; }
h2:after { content:close-quote; }
h2{ quotes:"(" ")" }//形如: （标题）关于如何利用css3在选择器中的页面中插入所需内容 就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。
