
css常用选择器:
1、id选择器:(一一对应,一个id对应一个元素)为标有特定 id 的 html元素指定特定的样式。以 "#" 来定义。
例子:
html代码
<div id="only">哈哈哈哈哈</div>
css代码
#only{
background-color: red;
}div中的元素背景颜色显示为红色
2.类(class)选择器:(多对多,一个元素可以对应多个class,一个class可以对应多个元素)class选择器以“.”来定义。
例子:
html代码
<p class="demo">hahahahhahaha</p>
css代码
.demo{
background-color: red;
}p中元素的背景颜色为红色
当一个元素对应多个class的时候,可以直接在demo后加空格继续写,如下
html代码
<p class="demo demo1">hahahahhahaha</p>
css代码
.demo{
background-color: #f40;
}
.demo1{
color:yellow;
}3.标签选择器:标签选择器以标签名来定义。选中后所有该标签均变化
html代码
<span>哈哈哈哈哈</span>
<div>
<span>hahahhahhaha</span>
</div>css代码
span{
color:green;
}所有span标签中的元素颜色都是green
4.通配符选择器:通配符选择器以"*"来定义,对于所有的标签都适用。
例子:
html代码
<p>galaxyhahhaha</p>
<div>哈哈哈哈哈哈哈</div>
<strong>你好</strong>css代码
* {
background-color:yellow;
}5.父子选择器/派生选择器:创建规则,使规则在某些文档结构中起作用,而在另外一些结构中不起作用。
举例,如果希望只对 div元素中的 span元素应用样式
html代码:
<div> <strong> <span>123</span> </strong> </div> <span>345</span>
css代码:
div strong span{
background-color: red;
}推荐:css手册
以上就是css常用什么选择器?的详细内容,更多请关注易知道|edz.cc其它相关文章!













