Question

我的网页中只包含一个元素。我必须以mm为单位设置此元素的宽度，但我稍后需要以像素为单位的宽度。我使用css代码设置宽度，如：

width:50mm

并使用

获取一段时间后的宽度

$(element).width()

这给了我189个结果。然后我按下键盘上的“Print Screen”按钮并将剪贴板内容粘贴到图像编辑器中，奇怪的是它的宽度是252px！

我很好奇为什么这些价值观彼此相距很远？

这是我的代码：https://jsfiddle.net/k9w1fz0k/

Answer 1

如果元素具有填充或边框，则不会在＆＃34;布局宽度＆＃34;中考虑填充。元素的元素（由$（element）.width（）返回），但会增加元素的可视大小。原因是宽度是元素的CSS属性，而不是计算的属性。

＆＃13;

#foo {
  width: 100px;
  height: 100px;
  background: red;
}

#bar {
  width: 100px;
  height: 100px;
  padding: 100px;
  background: blue;
}

＆＃13;

<div id="foo">foo</div>
<div id="bar">bar</div>

＆＃13;

$（element）.width（）与像素中的实际宽度之间存在奇怪的差异

1 个答案: