💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、豆包、星火、月之暗面及文生图、文生视频 广告
### 组合选择器 * 邻近元素选择器 ~~~ /*选中紧接在另一个元素后的元素,示例中,只有每个ul后面的第一个段落设置了样式。*/ ul + p /*选中除了第一个li元素外的其它邻近的li后面的兄弟元素*/ li + li { color: red;} <li>1</li><li>2</li><li>3</li> ~~~ * 兄弟选择器 ~~~ /*选择某一个指定元素后面的所有符号条件的兄弟节点*/ h1 ~ p{ color: red;} ~~~ * 条件选择器 > `:lang`指定标记语言的`元素` > `:dir()`指定编写方向的`元素` > `:has`包含指定元素的`元素` > `:is`指定条件的`元素` > `:not`非指定条件的`元素` > `:where`指定条件的`元素` > `:scope`指定`元素`作为参考点 > `:any-link`所有包含`href`的`链接元素` > `:local-link`所有包含`href`且属于绝对地址的`链接元素` * 状态选择器 > `:active`鼠标激活的`元素` > `:hover`鼠标悬浮的`元素` > `:link`未访问的`链接元素` > `:visited`已访问的`链接元素` > `:target`当前锚点的`元素` > `:focus`输入聚焦的`表单元素` > `:required`输入必填的`表单元素` > `:valid`输入合法的`表单元素` > `:invalid`输入非法的`表单元素` > `:in-range`输入范围以内的`表单元素` > `:out-of-range`输入范围以外的`表单元素` > `:checked`选项选中的`表单元素` > `:optional`选项可选的`表单元素` > `:enabled`事件启用的`表单元素` > `:disabled`事件禁用的`表单元素` > `:read-only`只读的`表单元素` > `:read-write`可读可写的`表单元素` > `:target-within`内部锚点元素处于激活状态的`元素` > `:focus-within`内部表单元素处于聚焦状态的`元素` > `:focus-visible`输入聚焦的`表单元素` > `:blank`输入为空的`表单元素` > `:user-invalid`输入合法的`表单元素` > `:indeterminate`选项未定的`表单元素` > `:placeholder-shown`占位显示的`表单元素` > `:current()`浏览中的`元素` > `:past()`已浏览的`元素` > `:future()`未浏览的`元素` > `:playing`开始播放的`媒体元素` > `:paused`暂停播放的`媒体元素` * 结构选择器 > `:root`文档的`根元素` > `:empty`无子元素的`元素` > `:nth-child(n)`元素中指定顺序索引的`元素` > `:nth-last-child(n)`元素中指定逆序索引的`元素` > `:first-child`元素中为首的`元素` > `:last-child`元素中为尾的`元素` > `:only-child`父元素仅有该元素的`元素` > `:nth-of-type(n)`标签中指定顺序索引的`标签` > `:nth-last-of-type(n)`标签中指定逆序索引的`标签` > `:first-of-type`标签中为首的`标签` > `:last-of-type`标签中为尾`标签` > `:only-of-type`父元素仅有该标签的`标签` * 属性选择器 > `[attr]:`指定属性的元素 > `[attr=val]:`属性等于指定值的元素 > `[attr*=val]:`属性包含指定值的元素 > `[attr^=val]:`属性以指定值开头的元素 > `[attr$=val]:`属性以指定值结尾的元素 * 伪元素 > `::before`:在元素前插入内容; > `::after`:在元素后插入内容;