0

我一直在寻找。对不起，我现在很绝望，所以我想我会在这里问。下面是一个 HTML 示例。当 B 列长于单个页面时（视口，抱歉，我不确定此处的术语是否正确），则 A 和 C 不会在高度上扩展以填充容器 div。它们填满整个页面，但即使 B 列比单页长，它们也会以单页长度停止。任何想法，我一直在拔头发。我一直在玩高度和最小高度，但似乎没有任何效果。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
        <style type="text/css">
            html, body 
            {
                height: 100%;
                background-color: gray;
                padding: 0;
                margin: 0;
            }

            #container
            {
                height: 100%;
                margin: auto;
                padding: 0px;
                width: 610px;
            }

            #a
            {
                width: 5px;
                min-height: 100%;
                float: left;
                background-color: yellow;
            }

            #b
            {
                width: 600px;
                background-color: Blue;
                float:left;
                min-height: 100%;
            }

            #c
            {
                width: 5px;
                float:left;
                min-height: 100%;
                background-color: green;
            }
        </style>
</head>
<body>
        <div id="container">
            <div id="a"></div>
            <div id="b">
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
                <p>more</p>
            </div>
            <div id="c"></div>
    </div>
</body>
</html>

编辑：在我浪费时间向我解释水平抓取一个像素然后平铺之前，设计师给了我一个垂直渐变。顶部开始变暗，结束变浅。那以及阴影效果。阴影水平运行。因此，据我所知，没有办法对其进行切片，然后巧妙地使用平铺。

4

2 回答 2

1

到目前为止，最简单的方法是使用单行表而不是 div。表格可能不是超级酷的做事方式，但归根结底，与尝试使用 css 实现相同目标相比，它们的代码量要少得多。

于 2009-04-28T20:35:47.327 回答
0

你见过假柱子的把戏吗？

于 2009-04-28T20:57:06.607 回答