0

嗨，我正在尝试将 div 放置在 TD 内 div 的左上角，这个问题的灵感来自这个 问题，旨在帮助定位 TD 中的元素。我无法让它工作。我想这可能是因为我有填充。如果您能帮助我将代码中的“目标”元素放到我的 TD 的左上角，那么任何方式都会很棒。

我尝试获取 TD 内包装的宽度和高度，看起来高度只是文本。我想我希望内部包装的高度与 TD 相同，因此可以将目标 div 定位在角落。我听说你不能在 TD 中定位

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>table</title>
    <style>
        td,th{
            padding: 20px 30px;
        }
        .innerWrapper{
            position:relative;
        }
        .target{
            position: absolute;
            top:0;
            left: 0;
            background-color: blue;
        }
        td:nth-child(1){
            background-color: yellow;
        }
    </style>
    <script  src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
    <table>
        <tr>
            <th>one</th>
            <th>two</th>
            <th>three</th>
            <th>four</th>
        </tr>
        <tr>
            <td><div class = "innerWrapper">td1<div class = "target">T</div></div></td>
            <td>td2</td>
            <td>td3</td>
            <td>td4</td>
        </tr>
    </table>
        <script>
            $(document).ready(function(){
                tdh = $('td:nth-child(1)').outerHeight()
                alert("td"+ tdh);
                var inner = $('.innerWrapper').outerHeight(tdh);
                alert(inner);
            });
        </script>
</body>
</html>

JsFiddle 我试图制作一个脚本来将内部包装器设置为与 TD 相同的高度，但这没有用，我想知道为什么。如果您也可以提供帮助，那就太好了。

4

1 回答 1

1

您需要将填充从单元格移动到包装器中（或适当地偏移目标部分）。

于 2013-10-13T10:53:43.447 回答