cuốn sách gpt4 ai đã làm

100% 高度的 css 困难

In lại Tác giả: Walker 123 更新时间:2023-11-28 14:17:14 35 4
mua khóa gpt4 Nike

我正在尝试创建一个左侧面板的页面。该面板有一个页眉、一个内容区域和一个页脚。主面板包装器 div 应该是页面高度的 100%。页眉和页脚没有指定的高度,因为我只希望它们足够大以容纳其文本和填充,而我希望中心内容区域是容器的 100% 减去页眉和页脚的高度。我不确定如何或是否可以在 css 中执行此操作。有人知道在这里做什么吗?谢谢。

html 页面和 css 在这里 - https://gist.github.com/1641918

câu trả lời hay nhất

您可以使用 display as table 来完成此操作。通过在内容“行”上设置 100% 的高度,然后在其他行上设置 0%。表格尝试使它们的行尽可能接近指定的高度。

http://jsfiddle.net/PZALU/

html, body { height: 100%; width: 100%; }
div#container { display: table; height: 100%; width: 100%;}
div#container > div { display: table-row; }
div#container > div > div { display: table-cell; border: 1px solid gray; }
div#header { height: 0%; }
div#content {height: 100%; background: lightgray; }
div#footer { height: 0%; }

关于100% 高度的 css 困难,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8931906/

35 4 0
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress