以行高为宽度单位

Question

编辑：我强调不想依赖任何固定尺寸。

我有一个图像想要与文本内联显示。我想要图像

a) 是正方形的，并且

b) 与文字一样高。

想象一下，存在一个名为“H”的 CSS 单元，它等于一条线的高度，就像“ex”等于“x”的高度一样。我希望能够编写这样的代码：

img.myclass {
    width: 1H;
    height: 1H;
}

看来这样的单位实际上并不存在。我对吗？

如果没有这样的单位（明确地说，我想要从一行基线到下一行基线的距离）那么如何在没有Javascript的情况下实现行填充方形图像的目标？

Answer 1

您可以选择固定的宽度/高度并将 line-height 和 img 宽度/高度设置为该恒定大小，或者您可以使用 javascript。设置新属性时无法引用另一个 CSS 属性，而这正是您所希望的。