Question

我正在尝试将<span>相对于特定图像定位。我必须使用XHTML Transitional文档类型，因为这是应用程序在我使用它之前多年使用的内容，而且过多依赖于它。

以下代码正确地将<span>方向放在一边：

<html>
    <head>
        <style type="text/css">
            span.tooltip {
                z-index:1000;

                position:absolute;
                top:200;
                left:600;
            }
        </style>
    </head>
    <body>
        <span class="hasTooltip">
            <img src="https://www.google.com/images/srpr/logo3w.png" />
            <span class="tooltip">Tooltip!</span>
        </span>
    </body>
</html>

但是，此代码会中断<span>位置，无论left或top值是什么，它始终显示在同一位置：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <style type="text/css">
            span.tooltip {
                z-index:1000;

                position:absolute;
                top:200;
                left:600;
            }
        </style>
    </head>
    <body>
        <span class="hasTooltip">
            <img src="https://www.google.com/images/srpr/logo3w.png" />
            <span class="tooltip">Tooltip!</span>
        </span>
    </body>
</html>

如何使用XHTML Transitional doctype正确定位此<span>元素？

Answer 1

使用top: 200px和left: 600px。它们可以在任何模式下工作，而如果省略`px'，则它是不正确的CSS代码，仅适用于Quirks Mode。

CSS：使用XHTML Transitional Doctype定位绝对

1 个答案: