加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 资源网站 > 资源 > 正文

html – CSS padding添加到height/width

发布时间:2020-12-14 21:33:23 所属栏目:资源 来源:网络整理
导读:如果这个问题被问到,我很抱歉,但我找不到完全相同的问题。如W3schools所说,height属性不包括填充,边框或边距!所以这里有一个简单的样式声明: input { width:180px; height:18px; padding:7px; border:1px solid black;} 这里是html: input type='text
如果这个问题被问到,我很抱歉,但我找不到完全相同的问题。如W3schools所说,height属性不包括填充,边框或边距!所以这里有一个简单的样式声明:
input {
  width:180px;
  height:18px;
  padding:7px;
  border:1px solid black;
}

这里是html:

<input type='text' name='text' value='194px by 32px' /><br  />
<input type='submit' name='button' id='button' value='180px by 18px' />

文本字段预期为194像素×32像素,但提交按钮为180像素×18像素。显然,我只能增加身高按钮的宽度是填充的两倍,但是我想了解为什么会有差异。我在这里做了一个jsfiddle:http://jsfiddle.net/RRf5A/.谢谢你的帮助。我已经尝试过< button>而不是输入提交,并显示:inline-block。

解决方法

您可以通过添加box-sizing:content-box来解决这个问题。输入类型提交的元素。而不是详细介绍自己,我只会将您发送到 http://www.quirksmode.org/css/box.html.但是,目前尚未全面支持,所以您可能会发现跨浏览器兼容性更好地为提交按钮特别声明不同的高度和填充。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读