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

本文共 742 字,大约阅读时间需要 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> 

 

效果图如下:

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

本文转自cnn23711151CTO博客,原文链接:http://blog.51cto.com/cnn237111/1095630 ,如需转载请自行联系原作者

你可能感兴趣的文章
[转] SSH 密钥认证机制
查看>>
hihocoder [Offer收割]编程练习赛14 小Hi和小Ho的礼物
查看>>
JQuery EasyUI 动态改变表单项的验证守则
查看>>
Jmeter如何操作数据库
查看>>
iOS开发设置View某个角为圆角
查看>>
【python】python path,macports,easy-install,numpy,scipy,ipython,matplotlib,集成工具...
查看>>
学习进度总结
查看>>
ACCESS模糊查询出现"内存溢出"原因是日文片假名
查看>>
Error setting expression 'XXX' with value 设置表达式“XXX”时出错 解决方法
查看>>
javascript获取url参数和script标签中获取url参数
查看>>
CF359D:Pair of Numbers(数论)
查看>>
进制转换展示
查看>>
张泉灵:做投资这半年哭过的时间比前十年都多
查看>>
c++将bool变量以文字形式打印
查看>>
洛谷P1111 修复公路 并查集 图论 最小生成树
查看>>
微名汇-微信公众平台功能开发(微信聊天机器人)
查看>>
A2W和W2A :很好的多字节和宽字节字符串的转换宏
查看>>
_T和_L的区别
查看>>
我个人的javascript和css命名规范
查看>>
android ANR产生原因和解决办法
查看>>