近些天对h5非常感兴趣,边工作边学习,虽然比较累,但过得很踏实。每天都要学习一点东西,这样才能对得起自己。好了,废话不多说,进入今天的主题。

  今天遇到了一个非常有趣的东西,就是在修改submit按钮的宽度和高度时的问题。首先附上html代码。

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>baidu</title>
<style>
div{
/*width: 980px;*/
height: 300px;
text-align: center;
/*background-color: red;*/
}
.blank{
height: 50px;
}
input[type=text]{
width: 400px;
height: 30px;
}
input[type=submit]{
width: 100px;
height: 35px;
} </style>
</head>
<body>
<div class="header">
<div class="blank"></div>
<form action="">
<input type="text" />
<input type="submit" value="百度一下" class="submit">
</form>
</div>
</body>
</html>

  这样写,从理论上讲是没有问题的,在windows上面运行,submit按钮的高度改变了。但是,在Mac上面,准确来说在所有的苹果设备上面,submit的高度都没有发生变化,这是为什么,说实话,我到现在也不知道啥原因,姑且认为是WebKit的原因吧(我猜的,莫见怪),然后在firebox上面也是正常的。Mac上面chrome和Safari上面按钮的高度没有修改成功,后来Google了一下,发现只要加上一行代码,就可以成功修改submit按钮的高度了,那就是增加submit的背景颜色background-color,不要问我为什么,我也很慌啊。好了,这个坑希望能帮助到某些人,以后遇到其他的问题,还会继续分享。

submit按钮修改宽高的坑的更多相关文章

  1. canvas动态修改宽高问题

    Canvas元素默认宽 300px, 高 150px, 设置其宽高可以使用如下方法:方法一:1 <canvas width="500" height="500&qu ...

  2. 动态布局--动态修改RelativeLayout宽高的方法

    本文实例讲述了Android编程动态修改RelativeLayout宽高的方法.分享给大家供大家参考,具体如下: 我们经常会动态修改RelativeLayout的宽高,这样的代码,比较简单,就是修改R ...

  3. ios UIWebView加载HTMLStr图文,关于图片宽高设置,webView内容实际高度的踩坑问题

    一.关于UIWebView 与 WKWebView 选取问题 从发布时间看: 2008年7月11日,在新一代iPhone3G正式发售当天,iPhone OS 2.0(iOS 2.0)推出,这时候就有U ...

  4. 关于PHP HTML <input type="file" name="img"/>上传图片,图片大小,宽高,后缀名。

    在我们的系统中,不免要上传图片,视频等文件,在上传中,需要做的一些判断,文件大小等方面. 注意: 在php.ini 中的post_max_size,upload_max_filesize默认为2M,在 ...

  5. 翻屏类 h5 适配方案:解决宽高自适应难题

    表格 图片等 宽度自适应  :width:100%;  box-sizing: border-box; 基于淘宝适配方案flexible + 翻屏h5 适配方案adaptive flexible解读及 ...

  6. Qt TabWidget QTabBar 宽高设置

    /*************************************************************************** * Qt TabWidget QTabBar ...

  7. iOS学习-压缩图片(改变图片的宽高)

    压缩图片,图片的大小与我们期望的宽高不一致时,我们可以将其处理为我们想要的宽高. 传入想要修改的图片,以及新的尺寸 -(UIImage*)imageWithImage:(UIImage*)image ...

  8. BOM,文档宽高及窗口事件小析

    (一)BOM:Browser Object Model(浏览器对象模型)页面上所有的变量都是window的属性 一.方法:1. open(,)打开一个新窗口(页面)一参为页面地址url,二参为打开方式 ...

  9. NGUI 屏幕自适应(初始设定宽高800x480只支持比其大的屏幕)

    自适应讲解部分可以参考以下网址:http://www.xuanyusong.com/archives/2536,下面代码中提到的AdaptiveManualHeight()函数就是参考该文章的. 下面 ...

随机推荐

  1. The server has either erred or is incapable of performing the requested operation. (HTTP 500)

    感谢朋友支持本博客,欢迎共同探讨交流,因为能力和时间有限,错误之处在所难免,欢迎指正. 假设转载.请保留作者信息. 博客地址:http://blog.csdn.net/qq_21398167 原博文地 ...

  2. SVN使用(自己总结)

    1.第一次导入,注意要新建个readme.txt文件用于记录版本更改,每次导入时 要填写import message 2.第二次增加文件导入时 勾选未受控版本文件(新增加文件) 完成上传就可更新增加的 ...

  3. [容器]docker创建镜像

    手动创建: docker run -d -p mynginx:v2 nginx rpm -ivh http://mirrors.aliyun.com/epel/epel-release-latest- ...

  4. JAVA Socket 底层是怎样基于TCP/IP 实现的???

    首先必须明确:TCP/IP模型中有四层结构:       应用层(Application Layer).传输层(Transport  Layer).网络层(Internet Layer  ).链路层( ...

  5. [转]Ubuntu 12.04.3 LTS 安装 Qt5.1.1

    参考文档如下: http://blog.csdn.net/astonqa/article/details/9767043 http://www.qtcn.org/bbs/apps.php?q=diar ...

  6. AxureRP_for_chorme的安装和使用方法

    1.下载AxureRP_for_chorme_version.crx 2.打开Chrome,右上角菜单图标->更多->扩展程序 3.将crx文件拖入,安装 4.选中AxureRP的“已启用 ...

  7. NetBeans 设置code completion/auto pop-up delay

    如果你在Tools>Options>Editor>Code Completion>Language: Java 没有找到设置delay的选项.那就去C盘(如果你用的是Windo ...

  8. 第一百三十九节,JavaScript,封装库--CSS选择器

    JavaScript,封装库--修改元素选择器 就是将构造库函数修改成元素选择器,像css那样,输入#xxx .xxx xxx  (获取指定id下的指定class下的指定标签元素) 修改后的基础库 / ...

  9. 【BZOJ】2100: [Usaco2010 Dec]Apple Delivery(spfa+优化)

    http://www.lydsy.com/JudgeOnline/problem.php?id=2100 这题我要吐血啊 我交了不下10次tle.. 噗 果然是写挫了. 一开始没加spfa优化果断t ...

  10. UML学习目录

    用例图:http://www.cnblogs.com/yjjm/archive/2012/01/28/2385861.html http://kb.cnblogs.com/page/129491/