我对以下问题感到困惑。我希望(绝对)将一段 HTML 文本的基线定位在某个 y 坐标，而文本应该从某个 x 坐标开始。下图清楚地说明了这个问题。
所以我基本上想控制点 (x,y)，此后称为“基点”，在图中位于屏幕上，相对于文档 BODY 或某些 DIV 的左上角.重要提示:我事先不知道文本的字体系列或字体大小是什么。这很重要，因为我不想在更改字体时更改 CSS 中的所有位置。
在下面的代码中，我尝试将基点定位在 (200,100)，但它却将基点定位在该点的 DIV 的左上角。
<html>
<style>
BODY
{
position: absolute;
margin: 0px;
}
#text
{
position: absolute;
top: 100px;
left: 200px;
font-family: helvetica, arial; /* may vary */
font-size: 80px; /* may vary */
}
</style>
<body>
<div id="text">css=powerful</div>
</body>
</html>
那么我该如何修改这段代码呢？我应该使用封闭 DIV 的 vertical-align 属性吗？ (我试过了，但得不到想要的结果)。
感谢任何有用的回复。
最佳答案
基于 this blog post 的 Hacky 解决方案.
HTML:
<body>
<div id="text">css=powerful</div>
</body>
CSS:
body {
margin: 0;
}
#text {
font-size: 30px;
line-height: 0px;
margin-left: 100px;
}
#text:after {
content: "";
display: inline-block;
height: 120px;
}
JsFiddle .基点对齐到 (100, 120)。
关于html - 如何绝对定位HTML中文本的基线，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20443220/