css 设置div 高度无效
在css中设置一个DIV标签高度,但是不管设为百分之多少无论在那个浏览器看都无效,请问这是为什么,怎么解决?谢谢!注意,我想把高度设为百分比值,而不是像素!具体代码如下<...
在css中设置一个DIV标签高度,但是不管设为百分之多少无论在那个浏览器看都无效,请问这是为什么,怎么解决? 谢谢!
注意,我想把高度设为百分比值,而不是像素!
具体代码如下
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>产品展示</title>
<style type="text/css">
* {margin:0px; padding:0px;}
body{margin:0px; padding:0px; height:100%; width:100%;}
#showtop{height:13%; background-color:#00CCFF; border: 3px solid #000000;}
#title{height:100%; text-align:left; margin-left:5%; background-color:#FF99FF;}
#adiv{text-align:right; }
</style>
</head>
<body>
<!--顶部-->
<div id="showtop">
<div id="title">aaa</div>
<div id="adiv">ddd</div>
</div>
</body>
</html>
谢谢qisg931 ,可我就是想把 showtop 的 height 设成百分比值啊 展开
注意,我想把高度设为百分比值,而不是像素!
具体代码如下
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>产品展示</title>
<style type="text/css">
* {margin:0px; padding:0px;}
body{margin:0px; padding:0px; height:100%; width:100%;}
#showtop{height:13%; background-color:#00CCFF; border: 3px solid #000000;}
#title{height:100%; text-align:left; margin-left:5%; background-color:#FF99FF;}
#adiv{text-align:right; }
</style>
</head>
<body>
<!--顶部-->
<div id="showtop">
<div id="title">aaa</div>
<div id="adiv">ddd</div>
</div>
</body>
</html>
谢谢qisg931 ,可我就是想把 showtop 的 height 设成百分比值啊 展开
展开全部
只需要把HTML或BODY的高度设置为100%，然后在body内的任意DIV的高度用百分比表示，就可以了。具体代码如下：
<html>
<head>
<style>
body{height:100%;}//设置网页高度为百分之百
.login_wrapper{height:100%;}//设置整体布局高度为网页高度的百分之百
.login_header,.login_footer{background-color:black;height:20%;}//设置顶部和底部高度为百分之二十
.login_content{height:60%;}//设置内容区高度为百分之六十
</style>
</head>
<body>
<div class="login_wrapper">
<div class="login_header">网页顶部</div>
<div class="login_content">网页内容</div>
<div class="login_footer">网页底部</div>
</div>
</body>
</html>
<html>
<head>
<style>
body{height:100%;}//设置网页高度为百分之百
.login_wrapper{height:100%;}//设置整体布局高度为网页高度的百分之百
.login_header,.login_footer{background-color:black;height:20%;}//设置顶部和底部高度为百分之二十
.login_content{height:60%;}//设置内容区高度为百分之六十
</style>
</head>
<body>
<div class="login_wrapper">
<div class="login_header">网页顶部</div>
<div class="login_content">网页内容</div>
<div class="login_footer">网页底部</div>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
子容器的百分比高宽值，取决于父容器的高宽值了，
如果父容器没定义，子容器中使用百分比则无效，相当于设置为auto
如果父容器没定义，子容器中使用百分比则无效，相当于设置为auto
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
呵呵,这和你作为容器的div有关,你把showtop的height设个数值px,就能看到效果了.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
高度用自动就行了。
#showtop{height:auto;overflow:hidden;background-color:#00CCFF; border: 3px solid #000000;}
#showtop{height:auto;overflow:hidden;background-color:#00CCFF; border: 3px solid #000000;}
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
目前还没有纯css样式可以实现你想要的效果 只能用具体数值来定义
不过用JavaScript应该能实现你要的效果
不过用JavaScript应该能实现你要的效果
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（5）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
