类选择器(Class Selector):通过类别名称选择具有特定类别的 HTML 元素。类选择器以.开头,后面跟着类别名称。例如,.highlight #开头,后面跟着 ID 名称。例如, 属性选择器(Attribute Selector):通过元素的属性选择 HTML 元素。属性选择器可以根据属性名和属性值进行选择。例如,input[type="text"]选择器将选择所有type...
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference#Selectors 在css3规范中,定义了以下几种类型的selector: Basic selector type selector: elementname class selector: .classname ID selector: #idName universal selector: * ns|* *|* attribute selector [attr=value] Combinators adjacent sib...
属性选择器(Attribute Selector):根据元素的属性值选择元素。 代码语言:javascript 复制 [attribute="value"]{/* styles */} 伪类选择器(Pseudo-class Selector):例如,要选择所有链接的鼠标悬停状态,可以使用以下样式: 代码语言:javascript 复制 selector:pseudo-class{/* styles */} 伪元素选择器(Pseudo-element ...
.product类选择器选中了所有具有class="product"的<div>元素,并为它们添加了灰色边框、内边距和外边距,以创建产品框。 .product-title类选择器选中了所有具有class="product-title"的<h2>元素,并将标题的文字颜色设置为深灰色,字体大小设置为 20 像素。 .product-description类选择器选中了所有具有class="product-de...
参数(Attribute)选择器 除了id 和 class,也可以筛选其他参数进行匹配,并且除了全字匹配还提供了多重手段。 /* 存在 title 的 <a> 元素 */ a[title] /* 存在 href 属性并且值为"https://example.org"*/ a[href="https://example.org"] /* 存在 href 属性并且内容包含"example"*/ ...
[attribute="value"] {/* styles */} 10.伪类选择器(Pseudo-class Selector):例如,要选择所有链接的鼠标悬停状态,可以使用以下样式: selector:pseudo-class {/* styles */} 11.伪元素选择器(Pseudo-element Selector):用于创建元素的虚拟部分,如::before和::after。
基本的选择器规则(Selector) 类型(Type)选择器 类(Class)选择器 ID 选择器 参数(Attribute)选择器 通配符 组合选择器(Combinator) 子选择器和后代选择器 兄弟选择器和相邻兄弟选择器 选择器列表 伪类(Pseudo-Classes) 链接和按钮相关 表单输入相关 DOM 子节点相关 DOM 相关的其他伪类 其他 伪元素(Pseudo-elements...
在CSS中,可以使用选择器来选择具有特定类名的元素。要选择确切的类名,可以使用以下选择器: 1. 类选择器(Class Selector):使用类选择器可以选择具有特定类名的元素。类选择器以点(.)...
简单选择器(Simple selectors):通过元素类型、class 或 id 匹配一个或多个元素。 属性选择器(Attribute selectors):通过 属性 / 属性值 匹配一个或多个元素。 伪类(Pseudo-classes):匹配处于确定状态的一个或多个元素,比如被鼠标指针悬停的元素,或当前被选中或未选中的复选框,或元素是 DOM 树中一父节点的第一...