LMLPHP后院

CSS之Button样式兼容Safari浏览器的写法技术

maybe yes 发表于 2016-10-29 22:43

HTML 默认的 button 样式在 Safari 系列浏览器中是不一样的,所以有些按钮样式在苹果设备中显示的比较怪异。下面给出兼容 Safari 浏览器的 button CSS 样式的写法,这样可以去除苹果设备浏览器中比较怪异的显示效果。

input.sb {
	cursor:pointer;
	color:white;
	background:#9ea2c0;
	width:98px;
	padding:0;
	letter-spacing:1px;
	-webkit-appearance:none;
}

上面的 CSS 中将 button 的背景和颜色做了修改如果不加上 padding:0 和 -webkit-appearance:none,在 Safari 浏览器中就会渲染出一个圆角的边框,并且按钮的宽度也增大了,在某些元素比较密集的情况页面就会错乱。

2024-12-22 16:22:05 1734855725 0.021367