组合使用css选择器

最新推荐文章于 2024-09-04 16:55:55 发布

codingWeb

最新推荐文章于 2024-09-04 16:55:55 发布

阅读量1.1k

点赞数

分类专栏： css html js

本文链接：https://blog.csdn.net/fesfsefgs/article/details/96124197

版权

本文介绍了CSS中如何组合使用类选择器和ID选择器，特别是在覆盖已有样式时的应用场景。例如，当需要改变一个已设定样式的元素，如将文章颜色从红色改为黑色，可以使用#header.override来实现，而不是依赖于!important。

摘要由CSDN通过智能技术生成

一、用法介绍

在css中.classA.classB指的是一个元素，同时满足classA和classB，即(class=“classA classB”)

<style>
.classA.classB{
  border:1px solid red;
}
.classa .classb{
  border:1px solid blue;
}
</style>
------------------------------------------------
<body>
<input type="text" class="classA classB" value="选择器为.classA.classB"/>
<div class="classa">
  <input class="classb" type="text" value="选择器为.classa .classb" />
</div>
</body>

在这里插入图片描述

id选择器也是类似的：

<style>
#id.class{
  width:150px;
  height:50px;
  background-color: red;
}
#id .class{
  width:150px;
  height:50px;
  background-color: green;
}
</style>
--------------------------------------------------------
<b