CSS
2019-03-29 21:09:51 0 举报AI智能生成
CSS
作者其他创作
大纲/内容
选择器
基础选择器
通配符选择器
元素选择器
ID选择器
类选择器
单类选择器
多类选择器(交集选择器)
分组选择器
选择器分组
声明分组
属性选择器
简单属性选择器
选择属性，不考虑值 ([ ])
选择单个属性值
h1[class]
选择多个属性值
a[href][title]
思考 —— 可以自定义属性设置样式
具体值属性选择器
值必须完全匹配 ===
选择单个值
选择多个值
部分属性值选择器
词列表
定义：根据值中的词进行选择
[class ~= 'warning'] 等同于 .warining
词列可以应用于任何属性
子串
定义：字符中是否包含
[foo^='bar'] 开头
[foo$='bar'] 结尾
[foo* = 'bar'] 包含
[foo|='bar'] 等于 bar 或则 bar-开头的单词
层次选择器
后代选择器
后代选择器(div p)
子选择器(div > p)
兄弟选择器
相邻兄弟选择器(div + p)
通用兄弟选择器(div ~ p)
伪类选择器
状态伪类选择器
静态伪类选择器
link 访问前
visited 访问后
focus 获取焦点
a 链接
input 表单
动态伪类选择器
hover 鼠标悬浮
active 鼠标按下
可以应用到任何元素
目标伪类选择器
a 标签 和 id 配合页面内跳转
否定伪类选择器
:not()
UI元素状态伪类选择器
checked
enabled
disabled
结构伪类选择器
E F:first-child
E F:last-child
E F:nth-child(n)
从父元素 E 下选第 n 个元素 且是 F， dom结构变动可能就匹配不上 很脆弱
E F:nth-last-child(n)
E F:first-of-type
E F:last-of-type
E F:nth-of-type(n)
从父元素 E 中获取所有的 F 元素中 选第 n 个，相对稳定
E F:nth-last-of-type(n)
E F:only-child
E F:only-of-type
E:empty
0 条评论
下一页
