CSS 属性选择器

具有特定属性的HTML元素样式。

CSS - 属性选择器

以下实例是把包含标题（title）的所有元素变为红色 ：

[title] { color:red; }

CSS - 属性和值选择器

以下实例设置标题title='pangugle'元素的边框样式:

[title=pangugle]{  border:1px solid #5F9EA0; }

<p title="pangugle">pangugle 教程</p>

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

包含指定值的title属性的元素样式的例子，使用（~）分隔属性和值 :

[title~=pangugle] { color:red; }

<p title="pangugle 教程">pangugle 教程</p>

表单样式

input[type="text"]
{
	width: 150px;
	border-radius: 4px;
	border: 1px solid #dcdfe6;
	height: 40px;
	line-height: 40px;
	padding: 0 15px;
}
input[type="button"]
{
	width: 60px;
	height: 30px;
	line-height: 30px;
	font-size: 12px;
	border-radius: 3px;
	color: #fff;
	background-color: #409eff;
	border: 1px solid #409eff;
}

<input type="text" name="name" placeholder="请输入姓名"/>
<input type="button" name="btn" value="提交" />