常用css选择器有哪些

要使用css对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择器。HTML页面中的元素就是通过CSS选择器进行控制的。

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;
}

更多相关技术内容咨询欢迎前往并持续关注六星社区了解详情。

程序员编程交流QQ群：805358732

如果你想用Python开辟副业赚钱，但不熟悉爬虫与反爬虫技术，没有接单途径，也缺乏兼职经验
关注下方微信公众号：Python编程学习圈，获取价值999元全套Python入门到进阶的学习资料以及教程，还有Python技术交流群一起交流学习哦。

0 条评论