近些天对h5非常感兴趣,边工作边学习,虽然比较累,但过得很踏实。每天都要学习一点东西,这样才能对得起自己。好了,废话不多说,进入今天的主题。
今天遇到了一个非常有趣的东西,就是在修改submit按钮的宽度和高度时的问题。首先附上html代码。
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>baidu</title> 6 <style> 7 div{ 8 /* 980px;*/ 9 height: 300px; 10 text-align: center; 11 /*background-color: red;*/ 12 } 13 .blank{ 14 height: 50px; 15 } 16 input[type=text]{ 17 width: 400px; 18 height: 30px; 19 } 20 input[type=submit]{ 21 width: 100px; 22 height: 35px; 23 } 24 25 </style> 26 </head> 27 <body> 28 <div class="header"> 29 <div class="blank"></div> 30 <form action=""> 31 <input type="text" /> 32 <input type="submit" value="百度一下" class="submit"> 33 </form> 34 </div> 35 </body> 36 </html>
这样写,从理论上讲是没有问题的,在windows上面运行,submit按钮的高度改变了。但是,在Mac上面,准确来说在所有的苹果设备上面,submit的高度都没有发生变化,这是为什么,说实话,我到现在也不知道啥原因,姑且认为是WebKit的原因吧(我猜的,莫见怪),然后在firebox上面也是正常的。Mac上面chrome和Safari上面按钮的高度没有修改成功,后来Google了一下,发现只要加上一行代码,就可以成功修改submit按钮的高度了,那就是增加submit的背景颜色background-color,不要问我为什么,我也很慌啊。好了,这个坑希望能帮助到某些人,以后遇到其他的问题,还会继续分享。