0

您好，我是 html 和 css 的新手。我开始制作一个小盒子，我想在其中展示一张桌子。但由于某种原因，我的桌子最终落到了盒子下面。h4不知何故留在盒子里。请帮忙。框名= content2，我像这样在css中制作了这个。

#content2{
    margin: 30px 0;
    background: white;
    padding: 20px;
    clear: both;
    box-shadow: 0px 1px 1px #999;
    text-align: center;
}

我的 html 看起来像这样：

<div id="content2">
     <h4>Onze producten</h4>

    <table align="left">
        <tr>
            <td>100</td>
            <td>200</td>
            <td>300</td>
        </tr>
        <tr>
            <td>
                <img src="../images/boy1.jpg" alt="Boy1" width="165" height="246" hspace="20" target="_blank" href="kleding.htm">
            </td>
            <td>
                <img src="../images/girl1.jpg" alt="Girl1" width="165" height="246" hspace="20" target="_blank" href="kleding.htm">
            </td>
            <td>
                <img src="../images/boy2.jpg" alt="Boy2" width="165" height="246" hspace="20" target="_blank" href="kleding.htm">
            </td>
            <td>
                <img src="../images/girl3.jpg" alt="Girl2" width="165" height="246" hspace="20" target="_blank" href="kleding.htm">
            </td>
        </tr>
        <tr>
            <td>400</td>
            <td>500</td>
            <td>600</td>
        </tr>
    </table>
</div>
4

3 回答 3

0

尝试使用溢出：隐藏；在 #content2 的 css 中，发布表格的所有 css，这样更容易找出问题

于 2013-10-15T22:15:20.617 回答
0

您在中心 tr 标签中有四个 td 标签，而在顶部和底部 tr 标签中只有三个。这会打破你的桌子。要么在顶部和底部 tr 标签中添加额外的 td，要么在中心 td 标签之一中使用 colspan="2" 。

于 2013-10-15T22:16:42.673 回答
0

发生这种情况是因为 div 的溢出属性的默认值是允许在它们溢出时呈现，因此您需要指定其他内容，例如溢出：隐藏；或溢出：自动；阻止它使用默认行为。

进一步阅读：https ://developer.mozilla.org/en-US/docs/Web/CSS/overflow

“可见：默认值。内容不被剪裁，它可能会呈现在内容框之外。”

于 2013-10-15T22:28:48.170 回答