1,直接在元素上定义style,如下:
1
<input type="button" style="这里定义样式">
2,页面中内嵌样式,如下:
1
2
3
4
<style>
.btn{需要添加的样式}
</style>
<input type="button" class="btn">
3,外部引用css文件,如下:
1
<link rel="stylesheet" type="text/<a href="https://www.baidu.com/s?wd=css&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1Y4nyDsn1m1P1TzPHckPhwW0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EPjnYnW0Ln1R" target="_blank" class="baidu-highlight">css</a>" href="这里是css文件的路径">
只要在样式里面加一句去掉css去掉iPhone、iPad的默认按钮样式就可以了。 (不要写在class里哦)
input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none}
textarea { -webkit-appearance: none}
如果还有圆角的问题,
.button{ border-radius: 0 }
1、去除Chrome等浏览器文本框默认发光边框
input:focus, textarea:focus {outline: none}
去掉高光样式:
input:focus{
-webkit-tap-highlight-color:rgba(0,0,0,0)
-webkit-user-modify:read-write-plaintext-only}
当然这样以来,当文本框载入焦点时,所有浏览器下的文本框的边框都不会有颜色上及样式上的变化了,这样的话,当文本框载入焦点时,边框颜色就会变为橙色,给用户一个反馈。
2、去除IE10+浏览器文本框后面的小叉叉,只需下面一句就ok了
input::-ms-clear {display: none}