您的位置：首页 > 其它

使用选择器在页面中插入

2016-03-23 14:53 393 查看 
<pre name="code" class="html"><!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>使用选择器插入内容</title>
<style>
h2:before{
content:"text";
color: aliceblue;
background: green;
padding: 1px 5px;
margin-right: 10px;
}
/*
排除一些不需要插入内容的元素
使用content属性的追加一个none属性值
*/
h2.nocontent:before{
content: none;
}
/*
插入图片文件
只需指定图片的位置url
*/
h2.nocontent:before{
content: url("1.png");
}
</style>
</head>
<body>
<h1>使用选择器插入内容</h1>
<h2>使用选择器插入内容</h2>
<h2>使用选择器插入内容</h2>
<h2 class="nocontent">使用选择器插入内容</h2>
<h2>使用选择器插入内容</h2>
<h2>使用选择器插入内容</h2>
</body>
</html>
/*<pre style="font-family: 宋体; font-size: 12pt; background-color: rgb(255, 255, 255);">在多个标题前加上连续编号
*/
<pre name="code" class="html"><pre name="code" class="html"><!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title>在多个标题前加上连续编号</title><style>/*一丶使用方法：元素 ：before｛content：counter（计数器）；｝元素｛counter—increment: 计数器；｝*/h1:before{content: counter(hajsq);}h1{counter-increment:hajsq;counter-reset: sec;}/*二丶  在项目编号中添加文字方法：元素：before｛content：'第'counter（计数器）‘章’｝*/h1:before{content: '第'counter(hajsq)'章';counter-reset: sec;}/*三丶  指定编号的种类方法  content：counter（计数器，类型）*/h1:before{content: '第'counter(hajsq,upper-alpha)'章';}/*编号的嵌套编号重置，在其父节点：counter-reset(计数器)h1{counter-increment:hajsq;counter-reset: sec;}*/h2:before{content: counter(sec);}h2{counter-increment:sec ;}</style></head><body><h1>在多个标题前加上连续编号</h1><h2>hsjhfjksdhfjkshfjkshf</h2><h1>在多个标题前加上连续编号</h1><h2>hsjhfjksdhfjkshfjkshf</h2><h1>在多个标题前加上连续编号</h1><h2>hsjhfjksdhfjkshfjkshf</h2><h1>在多个标题前加上连续编号</h1><h2>hsjhfjksdhfjkshfjkshf</h2></body></html>

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航