[分享]css3属性选择器7个案例

 CSS3属性选择器是一个强有力的工具，在很多时候能够帮助我们快速定位到页面中特定的元素，这篇文章将分享七个常用的属性选择器的案例。 1. 根据属性名选择元素： { color: 999; } 2....

 CSS3属性选择器是一个强有力的工具，在很多时候能够帮助我们快速定位到页面中特定的元素，这篇文章将分享七个常用的属性选择器的案例。

1. 根据属性名选择元素：

  [placeholder] {
        color: #999;
    } 

2. 根据属性值选择元素：

  [type="password"] {
        background-color: #eee;
    } 

3. 选择包含某些特定属性值的元素：

  [class^="nav"] {
        background-color: #ddd;
    } 

4. 根据属性值中包含某些特定字符串的元素：

  [href*="css"] {
        text-decoration: underline;
    } 

5. 根据属性值以某些特定字符串开头的元素：

  [class|="title"] {
        font-weight: bold;
    } 

6. 根据属性值以某些特定字符串结尾的元素：

  [class$="nav"] {
        color: blue;
    } 

7. 选择自定义属性存在的元素：

  [data-toggle] {
        cursor: pointer;
    } 

这七个案例展示了属性选择器的强大功能，希望能够帮助你更好地使用CSS。