Question

<div style="width:100px"> <input type="text" style="width:100%;padding:5px;"/> </div>

请问input标签的实际宽度是多少？

Answer 1

通过盒子模型来分析

1. input内容区域就是width继承了父元素的100px

2. input设置了padding:5px即宽度+10px

3. 查看input默认border的值（我在谷歌中查的是“border: 2px inset”）两边再+4px

4. 得出结果114px（可能浏览器兼容边框尺寸会有差异，根据实际为主）
   

Answer 2

100px * 100% = ？

追问

你这是？

追答

楼下的兄弟，你看我写的例子

下面是加了padding的效果，应该是指定了宽度，所以并没有向外扩。