移动端的特殊样式

前言:
移动端浏览器给一些标签增加了默认的样式,有时候并不需要,这时候就需要去除默认样式。

1.去除点击链接高亮效果

a {
	/*去除高亮效果,点击链接背景颜色变为透明色*/
	-webkit-tap-highlight-color: transparent;
}

2.去除input:button默认样式

input {
	/*去除自带的默认样式*/
	-webkit-appearance: none;
}

3.css3盒子模型

/*传统盒子模型 width=border+width+padding*/
div {
	width:100px;
	height: 100px;
	background-color: blue;
	border: 10px solid red;
	padding: 20px;
}
/*此时div的宽度为 100+20+40=160px;*/

/*css3盒子模型 width=width,里面的border和padding值不会撑开盒子*/
div {
	box-sh
	width:100px;
	height: 100px;
	background-color: blue;
	border: 10px solid red;
	padding: 20px;
}
/*此时div的宽度为100px,边框和内边距没有撑开盒子*/