文章目录1. 基本属性选择器2. 属性值完全匹配选择器3. 属性值包含子串选择器4. 属性值以特定值开头选择器5. 属性值以特定值结尾选择器6. 属性值以空格分隔的词匹配选择器7. 属性值以连字符分隔的开头词匹配选择器总结中括号在CSS中扮演着重要的角色，它们通常用于属性选择器（attribute selectors），用于匹配具有特定属性的 HTML 元素。
1. 基本属性选择器语法：[attribute]
含义：选择包含指定属性的元素，无论属性的值是什么。
示例：
[title] { color: blue;作用：选择所有具有 title 属性的元素，例如：
div This is a div. /div 2. 属性值完全匹配选择器语法：[attribute="value"]
含义：选择属性值完全等于某个值的元素。
示例：
[type="text"] { border: 1px solid red;作用：选择所有 type 属性值为 text 的元素，例如：
input 3. 属性值包含子串选择器语法：[attribute*="value"]
含义：选择属性值中包含指定子字符串的元素。
示例：
[class*="error"] { background-color: yellow;作用：选择类名中包含 error 的所有元素，例如：
div /div 4. 属性值以特定值开头选择器语法：[attribute^="value"]
含义：选择属性值以指定字符串开头的元素。
示例：
[href^="https"] { color: green;作用：选择所有链接地址以 https 开头的元素，例如：
a 威言威语 /a 5. 属性值以特定值结尾选择器语法：[attribute$="value"]
含义：选择属性值以指定字符串结尾的元素。
示例：
[src$=".jpg"] { border: 2px solid black;作用：选择所有 src 属性值以 .jpg 结尾的元素，例如：
img src="image.jpg" 6. 属性值以空格分隔的词匹配选择器语法：[attribute~="value"]
含义：选择属性值中包含指定值（作为独立词）的元素。
示例：
[class~="button"] { font-weight: bold;作用：选择类名中包含 button 的元素，例如：
div /div 7. 属性值以连字符分隔的开头词匹配选择器语法：[attribute|="value"]
含义：选择属性值等于指定值或以指定值开头，后跟一个连字符（-）的元素。
示例：
[lang|="en"] { direction: ltr;作用：选择 lang 属性值为 en 或以 en- 开头的元素，例如：
p /p中括号在 CSS 中的作用主要是用来筛选具有特定属性及属性值模式的元素，非常适合在 HTML 中实现更精确的样式控制。通过这些选择器，我们可以根据需要灵活地应用样式。