博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CSS选择器 类选择器 .classA.classB 和.classA .ClassB的区别
阅读量:6632 次
发布时间:2019-06-25

本文共 662 字,大约阅读时间需要 2 分钟。

在 CSS 中,类选择器以一个点号显示:

.center {text-align: center}

.classA.classB指的是一个元素,同时满足.classA和classB

<div class="classA classB"></div>

.classA .classB指的是classB内嵌于classA

<div class="class">

<div class="classB">

</div>

</div>

举个例子:

 

 
  1. <style> 
  2. .classa.classb 
  3.     background:green; 
  4. border: 1px solid blue ; 
  5. .classa .classb 
  6. background:yellow; 
  7. border: 1px solid black ; 
  8. </style> 
  9. <input type="text" class="classa classb"/> 
  10.  
  11. <div class="classa"> 
  12.    <input type="text" class="classb"/> 
  13. </div> 

 

效果图如下:

事实上不一定两个都是class选择器,可以直接用元素或者id选择。比如:

 

 
  1. <style> 
  2. input.text 
  3.      border: 1px solid red; 
  4. </style> 
  5. <div> 
  6.      <input type="text" class="text"/> 
  7. <input type="text"/> 
  8. </div> 

 

效果图如下:

具体的效果还要根据各个浏览器而定。

转载地址:http://pofvo.baihongyu.com/

你可能感兴趣的文章