星空网 > 软件开发 > 网页设计

CSS之后代选择器与多类选择器

<新人报到,欢迎拍砖#- ->

一、后代选择器

  说起CSS的后代选择器。它属于派生选择器中的一种,两者附属关系如下:

-->派生选择器

 ----CSS 后代选择器

 

 ----CSS 子元素选择器

 ----CSS 相邻兄弟选择器

  那么问题来了,什么时候需要用到后代选择器嘞?假设你需要为p元素中的span元素(.A类)设置特殊样式,可以用后代选择器选择该元素:

/*方式1*/
p span{...}
/*方式2*/
p .A{...}

     注意,上述代码的两个选择器间以空格空格空格分隔。另外,后代选择器使用起来灰常自由。这么说吧,上述例子中p元素不一定必须是span的老爸,只要是span的直系长辈比如爷爷都可以。换句话说,在p元素包含span元素的情况下,后代选择器就可以发挥作用了。

 

二、多类选择器

  接下来,来说说多类选择器。举个例子:

.funny{...}.handsome{...}.funny.handsome{...}

     注意,上述代码的两个选择器间没有没有没有空格分隔。好的,现在有.funny和.handsome这两个类,显然“我是个有趣并且帅的boy,两者缺一都不是我”是一个真命题,所以只有“.funny.handsome”这个多类选择器才可以选择我。但是单独的“.funny”不能选择我,原因见前文提到的真命题,“.handsome”选择器同理。

     好吧不闹了,多类选择器的用处挺多的,比如要设置“1、被点击(.selected);2、按钮的样式”,就可以用:

button.selected{...}

     这是我在博客园写下的第一篇博文,XD。完毕。




原标题:CSS之后代选择器与多类选择器

关键词:CSS

CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

价格飙升10000%!全球都等中国发口罩?:https://www.ikjzd.com/articles/116929
震惊!因刷评一事这20多位亚马逊卖家爆款惨遭曝光!:https://www.ikjzd.com/articles/11693
亚马逊listing优化方法和关键词布局详解!:https://www.ikjzd.com/articles/116933
全球前500富豪财富缩水4440亿美元 贝索斯和盖茨居首:https://www.ikjzd.com/articles/116934
疫情下,哪些物流领域在疯狂增长:https://www.ikjzd.com/articles/116935
疫情过后,跨境电商行业可能出现的三大变革:https://www.ikjzd.com/articles/116936
桂林酒店销售多少钱 桂林旅游宾馆价格:https://www.vstour.cn/a/410227.html
十里银滩旅游攻略玩什么住哪里怎么去?:https://www.vstour.cn/a/410228.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流