CSS六大基本选择器的简单介绍
本篇内容介绍了“CSS六大基本选择器的简单介绍”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!
创新互联公司:从2013年开始为各行业开拓出企业自己的“网站建设”服务,为数千家公司企业提供了专业的做网站、成都网站制作、网页设计和网站推广服务, 定制网站设计由设计师亲自精心设计,设计的效果完全按照客户的要求,并适当的提出合理的建议,拥有的视觉效果,策划师分析客户的同行竞争对手,根据客户的实际情况给出合理的网站构架,制作客户同行业具有领先地位的。
CSS是一种格式化网页的标准方式,用于设置网页的样式,并允许样式信息与网页内容分离的一种技术。要使用CSS对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。本文将向大家介绍六大基本选择器,即元素选择器、类选择器、ID选择器、通用选择器、伪类选择器、伪元素选择器。
1、元素选择器
p{color: goldenrod;}
h2{color: blueviolet;}
h3{color: rosybrown;}
this is the head title!
this is the second title!
古诗词鉴赏
2、类选择器
.txt01{
color: #8A2BE2;
}
.txt02{
color: tomato;
}
.txt03{
color: saddlebrown;
}
.txt04{
color: #BC8F8F;
}
欢迎来到类选择器
数据分析总结表
01 | 02 | 03 | 04 | 05 |
12.9 | 12.4 | 13.9 | 12.3 | 11.9 |
分析结果
3、ID选择器
#txt01{
text-align: center;
color: rosybrown;
}
#txt02{
text-align: center;
font: 楷体;
color: goldenrod;
}
#txt03{
font: 楷体;
font-size: 22px;
align-content: center;
text-align: center;
color: chocolate;
margin: auto;
}
#txt04{
text-align: center;
color: saddlebrown;
}
欢迎来到CSS页面
数据分析表
第一期 | 第二期 | 第三期 | 第四期 | 第五期 |
34.90 | 46.97 | 35.15 | 45.33 | 50.01 |
34.90 | 46.97 | 35.15 | 45.33 | 50.01 |
总结分析:
4、通用选择器
*{
text-align: center;
font-size: 24px;
color: chocolate;
font: "楷体";
margin: auto;
}
欢迎来到通用选择器页面
01 | 02 | 03 | 04 | 05 |
12.9 | 12.4 | 13.9 | 12.3 | 11.9 |
5、伪类选择器
a{
font-size: 14px;
font-weight: bold;
color: darkgray;
}
a:hover{
color: red;
}
6、伪元素选择器
p1
“CSS六大基本选择器的简单介绍”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站,小编将为大家输出更多高质量的实用文章!
网站栏目:CSS六大基本选择器的简单介绍
URL网址:http://abwzjs.com/article/iicdhp.html