CSS3----属性选择器 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            *{
                margin: 0;
                padding: 0;
            }
            /* #wrap > div{
                border: 1px solid;
            } */
            div[name^="a"]{
                border: 1px solid;
            }
        </style>
    </head>
    <body>
        <div id="wrap">
            <div name="a f">1</div>
            <div name="a_g">2</div>
            <div name="a_h">3</div>
            <div name="a_j">4</div>
            <div name="a_k">5</div>
        </div>
    </body>
</html>

3.属性选择器
/*存在和值属性选择器*/
[attr]：该选择器选择包含 attr 属性的所有元素，不论 attr 的值为何。
[attr=val]：该选择器仅选择 attr 属性被赋值为 val 的所有元素。
[attr~=val]：表示带有以 attr 命名的属性的元素，并且该属性是一个以空格作为分隔的值列表，其中至少一个值为val。

/*子串值属性选择器*/
[attr|=val] : 选择attr属性的值是val（包括val）或以val-开头的元素。
[attr^=val] : 选择attr属性的值以val开头（包括val）的元素。
[attr$=val] : 选择attr属性的值以val结尾（包括val）的元素。
[attr*=val] : 选择attr属性的值中包含字符串val的元素。

posted @ 2021-07-09 11:28  2237774566  阅读(54)  评论(0)    收藏  举报