属性选择器

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>属性选择器</title>
        <style type="text/css">
            /*
              为所有具有title属性p元素设置背景颜色黄色
              
              属性选择器 
                 - 根据元素中的属性或属性值选取指定元素
                语法 
                   [属性名] 选取含有指定属性的元素 
                   [属性名="属性值"] 选取含有指定属性值的元素
                   [属性名^="属性值"] 选取属性值以指定内容开头的元素
                   [属性名$="属性值"] 选取属性值以指定内容结尾的元素
                   [属性名*="属性值"] 选取属性值以包含指定内容的元素
                 
            */
          /*  p[title]{
              background-color: yellow; 
           } */
           
           /*
             为title属性值以ab揩油的元素设置颜色为黄
             p[title^="ab"]{
                 background-color: yellow;
             }
           
           */
        </style>
    </head>
    <body>
        <!-- 
           title属性,这个属性可以给任何标签指定 
           鼠标移入到元素上时,元素中title属性值作为提示文字显示
         -->
         <p title="hello">我是一个段落</p>
         <p>我是一个段落</p>
         <p>我是一个段落</p>
         <p>我是一个段落</p>
         <p>我是一个段落</p>
         <p title="abc">我是一个段落</p>
    </body>
</html>

 

 

属性选择器根据元素中的属性或属性值选取指定元素

语法

  [属性名] 选取含有指定属性的元素

  [属性名=“属性值”] 选取含有指定属性值的元素

  [属性名^="属性值"] 选取属性值以指定内容开头的元素

  [属性名$="属性值"] 选取属性值以指定内容结尾的元素

  [属性名*="属性值"] 选取属性值以包含指定内容的元素

 

属性选择器

上一篇:vue router是什么?


下一篇:迅为-i.MX6ULL开发板-网络测试方法(二)