视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
div中top和height使用百分比无效的问题_html/css
2020-11-27 16:31:38 责编:小采
文档

CSS

各位高手,小弟新手请教一个比较低级的问题
我在login.jsp中使用div将几个text框和一个botton定位到背景图上相应的位置。但是我在css中对height和top使用百分比时无效,但使用像素又是可以的。我百度了该情况,一般都说是因为IE默认body的height为空的,必须定义body的height才可以。但我已定义了body的height为了100%,仍然无效。只好请教各位高手了。下面是具体的代码:

css文件中作了几个定义:
.loginBg{
background-repeat:no-repeat;
background-position:center top;
background-image:url(../images/loginBackGroud.jpg);
background-attachment:fixed;
margin: 0px;
width:100%;
height:100%;
}
.loginTableTop{
position:relative;
float:center;
top:14.29%;
/*top:100px;*/
width:50%;
height:53.57%;
z-index:999;
background-color:green;
}
.loginTable{
position:relative;
float:center;
left:0%;
top:46.86%;
/*top:328px;*/
width:30%;
height:17.86%;
/*height:125px;*/
z-index:999;
background-color:red;
}
.loginTableBottom{
position:relative;
float:center;
width:80%;
heigth:32.86%;
top:500px;
z-index:999;
background-color:blue;
}


我在login.jsp文件中是这样使用的







回复讨论(解决方案)

没人愿意帮忙吗?????

只有当DIV是绝对定位时,高度才能使用百分比

你的意思是DIV中style="position:ralative"改为absulte?
但是这样的话,当浏览器窗口大小发生改变的时候,位置就会发生改变呀
如果我还是想用relative的话,怎么设置高度呢

ie9 以下 使用 position:ralative 的块级 元素使用 高度百分比是无效的。
firefox,webkit浏览器就起作用。

为了兼容各款浏览器,建议你加入min-height属性
还有你现在的布局实在是太糟糕了,表格使用过度了
你把你想要的效果图贴上来,我再看看怎么帮你吧。

这是背景图:

我的想法是将用户框、密码框和登录做到地图的位置。位置为相对的,可以随着浏览器大小变化自动调节
但是高度无效

你是不是想实现 登录对话框屏幕居中啊?

对,我是想让正好和地图的登陆框重合
从视觉上是在底图的登陆框那里进行输入帐户密码

背景 和 登录框 必须分离出来,不然不好定位。
加Q 225733202

下载本文
显示全文
专题