属性选择器

目录

一、作用

二、举例

---

一、作用

选中属性值符合一定要求的元素

二、举例

1、代码

/* 1、选中具有title属性的元素 */
/* div[title] {
    color: aqua;
} */
/* 2、选中title属性值为shifu的元素 */
div[title="shifu"] {
    color: cornflowerblue;
}
/* 3、选中title属性值以t开头的元素 */
div[title^="t"] {
    color: chartreuse;
}
/* 4、选中title属性值以a结尾的元素 */
div[title$="a"] {
    color: darkkhaki;
}
/* 5、选中title属性值包含x的元素 */
div[title*=x] {
    color: hotpink;
}

<div title="shifu">唐僧</div>
<div title="tudi">孙悟空</div>
<div title="tudi">猪八戒</div>
<div title="tuti">沙和尚</div>
<div title="bailongma">白龙马</div>
<div title="xitian">西天取经</div>

2、运行效果