javascript - 如何定位:after element to 50% of target element height

Question

如何将 :after 元素定位到父元素高度的 50%？

我无法通过js访问:after来动态改变，这将是一个简单的计算。

该元素是一个 div 并且 :after 的相对绝对位置应该具有 div 高度的 50% 的顶部值。

Answer 1

试试这个:

div {
  height: 200px;
  width: 200px;
  background-color: blue;
  display: table;
}
div:after {
  content: "Hello";
  display: table-cell;
  vertical-align: middle;
}

<div></div>