• submit按钮修改宽高的坑


      近些天对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,不要问我为什么,我也很慌啊。好了,这个坑希望能帮助到某些人,以后遇到其他的问题,还会继续分享。

  • 相关阅读:
    Android EditText 文本框实现搜索和清空效果
    Android学习笔记之打钩显示输入的密码
    Mysql limit offset
    Android SDK更新以及ADT更新出现问题的解决办法
    Android Broadcast Receiver 使用入门
    立即执行函数
    JS 原型 & 继承
    JS 对象
    chrome extension overview
    JS 修改元素
  • 原文地址:https://www.cnblogs.com/lmfboke/p/6564692.html
Copyright © 2020-2023  润新知