博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
我对于层次选择器的理解~
阅读量:7239 次
发布时间:2019-06-29

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

对HTML页面中的元素使用CSS实现一对一,一对多或者多对一的控制,要用到CSS选择器。在大篇CSS代码中,并没有说明什么样式服务于什么元素,只是在元素中使用了class属性。而class属性本身没有语义,它纯粹是用来为CSS服务的,属于多余属性,并没把样式和元素绑定起来,一个CSS类选择器,文本框可以使用,下拉框也可以使用,甚至按钮也可以使用,这样其实非常混乱, 修改时就不方便,所以CSS3中提倡使用选择器来将样式与元素直接绑定起来,这样的话,在样式中什么样式与什么元素相匹配就会变得一目了然,修改起来也很方便。不仅如此,通过css3选择器我们还可以实现各种复杂的指定, 同时也能大量减少样式表的代码书写量,最终书写出来的样式表也会变得简洁明了。

 

层次选择器
类型 功能描述
E    F
后代选择器 选择匹配的F元素,且F元素被包含在匹配的E元素内
E > F
子级选择器 选择匹配的F元素,且F元素是E元素的子元素
E + F
兄弟选择器 选择匹配的F元素,且F元素是E元素后面紧邻的兄弟元素
E ~ F
通用选择器 选择匹配的F元素,且F元素是E元素后面的所有兄弟元素

后代选择器

格式:祖先元素+空格+后代元素

子级选择器

格式:父级元素+大于号+子级元素

可以说后代选择器包含了子级选择器

兄弟选择器

格式:兄弟元素A+"+"+兄弟元素B
注:选择A元素后的B元素,并且AB必须是紧邻的,即AB之间不许有其他元素

通用选择器

格式:兄弟元素A+"~"+兄弟元素B
选择匹配的B元素,即A元素后面的所有B元素

转载于:https://www.cnblogs.com/qingyijie/p/8052837.html

你可能感兴趣的文章
可靠信号
查看>>
yummain.py install yum 不能运行的原因 yummain.py not found
查看>>
ES6学习笔记--promise对象
查看>>
性能优化之 缓存 压缩配置
查看>>
Python-HTML基础
查看>>
MongoDB
查看>>
从PHP门外汉---菜鸟---高手的进阶之路
查看>>
Codeforces 789A Anastasia and pebbles( 水 )
查看>>
你心里住着一个小孩
查看>>
最近那些事儿……
查看>>
LINQ如何做SELECT TOP操作
查看>>
Merge k Sorted Arrays
查看>>
第一篇,书上的fortran用c++实现
查看>>
【转】关于cocos2dx+lua注册事件函数详解
查看>>
Swift3.0P1 语法指南——集合类型
查看>>
QT把widget转换成图片后打印
查看>>
JavaScript 运行机制详解:再谈Event Loop
查看>>
UVA 11214 Guarding the Chessboard
查看>>
在windows下安装elk
查看>>
Nginx故障迁移
查看>>