属性选择器

<style type="text/css">

    [class=my-test] {

      color: yellowgreen;

    }

    /*属性为my-test 的 所有元素*/

    p[class~="tests"] {

      color: darkcyan;

    }

    /*属性包含确定内容为tests 的所有元素

    class="my tests" 以及 class="tests my new"，但不匹配：class="my-tests" 或 title="testss"。

    */

    [class|="test"] {

      color: darkgreen;

    }

    /*

    class 属性以 "test" 开头的所有元素：

    值必须是完整或单独的单词，比如 class="top" 或者后跟连字符的，比如 class="top-text"

    */

    [class^="test"] {

      color: sienna;

    }

    /*

    选取 class 属性以 "test" 开头的所有元素：

    提示：值不必是完整单词！

    */

    [class$="test"] {

      color: darkred;

    }

    /*

    选取 class 属性只要是以 "test" 结尾的元素：

    提示：值不必是完整单词！

    */

    [class*="te"] {

      color: blue;

    }

    /*

    所有带有te 属性值的元素

    */

  </style>