gpt4 book ai didi

html - DIV 不显示指定的背景颜色

转载 作者:太空宇宙 更新时间:2023-11-04 05:12:38 25 4
gpt4 key购买 nike

我有以下带有 CSS 的 HTML 代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
div.scroll
{
background-color:#00FFFF;
position:absolute;
top:0%;
left:0%;
width:10%;
height:100%;
}

div.hidden
{
background-color:#00FF00;
position:absolute;
top:0%;
left:50%;
width:20%;
height:100%;
}

div.menu
{
position:absolute;
top:70%;
left:20%;
width:80%;
}
</style>
</head>

<body>
<p>The overflow property specifies what to do if the content of an element exceeds the size of the element's box.</p>

<div class="menu">
<div class="scroll">Scroll: You can use the overflow property when you want to have better control of the layout. The default value is visible.</div>
<div class="hidden">Hidden: You can use the overflow property when you want to have better control of the layout. The default value is visible.</div>
</div>
</body>

如您所见,我希望其中两个分区有颜色——它们没有,我也不知道为什么。该文件具有 html 扩展名,我已经使用 IE7 和 FF 3.0.3 进行了测试。

最让我困惑的是,它几乎是 W3C 学校的一个例子的逐字复制,它确实显示了颜色!示例链接:W3C example .

最佳答案

问题是height:100%; .这意味着该元素使用其父元素的所有高度,在本例中为 <div class="menu"> , 这是 0px 因为它的所有内容都定位在 absolute .

如果你想要每个div,你可以删除它具有其文本的大小,或者如果要对两个 div 应用相同的高度,则以像素为单位设置高度。

关于html - DIV 不显示指定的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8946203/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com