css-属性选择器

①属性选择器

[title]

{
color:blue;

}

②属性和值选择器

[title=w3cschool]
{
border:5px solid green;
}

③属性和值的选择器 - 多值

[title~=hello] { color:blue; }

       <h1 title="hello world">Hello world</h1>
       <p title="student hello">Hello CSS students!</p>

[lang|=en] { color:blue; }

       <p lang="en">Hello!</p>
       <p lang="en-us">Hi!</p>
       <p lang="en-gb">Ello!</p>

表单样式

属性选择器样式无需使用class或id的形式:

input[type="text"]
{
width:150px;
display:block;
margin-bottom:10px;
background-color:yellow;
}
input[type="button"]
{
width:120px;
margin-left:35px;
display:block;
}