jquery - 需要求一个字母的像素宽高

Question

我在 html 中设置了以下字体:

<div id="centerLeft"><span style="font-family: "myFont", Arial; font-size: 200%;">Z</span></div>

我需要找出这个字母 Z 的确切像素宽度和高度，以便将这个字母放在浏览器中的正确位置(稍微偏离浏览器中心的左侧)。

我的 centerLeft div 是:

#centerLeft {
  position: fixed;
  top: 47.4%;
  left: 53.5%;
  margin-top: -?px; NEED!
  margin-left: -?px; NEED!
}

关于如何获取它的尺寸有什么想法吗？

另一种选择!

#centerLeft {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
}

但是我不明白如何操作它，所以它停留在浏览器中的所需位置......它没有随浏览器窗口正确缩放(不停留在居中到左侧的位置)。我尝试将左侧更改为 48% 和翻译(-52%...等，但没有骰子。

谢谢。

Answer 1

使用 jQuery .outerHeight() 它将返回元素的外部高度

为了获得准确的值，删除元素的所有填充和边距