求 css 代码, 不要用 Javascript ( 如可免 )
做一个divlayer,width为60%,height为40%,无论文字缩放或浏览器放大缩小,都固定於页面!垂直!及!水平!置中.div中还得装一个table(就当只有...
做一个 div layer , width 为 60%, height 为 40%, 无论文字缩放或浏览器放大缩小, 都固定於页面 !垂直!及 !水平! 置中. div 中还得装一个 table (就当只有 1个 tr 及 td ) , 里面有些文字, width 要为此 div 的 100%, 重点是此 table 及其内文在放大缩小时要与 div 保持相对的比例 . 需兼容於 firefox, chrome, ie ( >=7 )
展开
4个回答
展开全部
不需要JS,兼容所有主流浏览器。
<style>
.box{display:inline-block;}
.box{*display:inline; *zoom:1; width:50px; height:80px; border:#000 1px solid; vertical-align:middle;}
i{display:inline-block; width:0; height:100%; vertical-align:middle;}
</style>
</head>
<body>
<div style="width:60%; height:40%; border:red 1px solid; text-align:center; position:absolute;">
<i></i>
<div class="box">afdafd</div>
</div>
<style>
.box{display:inline-block;}
.box{*display:inline; *zoom:1; width:50px; height:80px; border:#000 1px solid; vertical-align:middle;}
i{display:inline-block; width:0; height:100%; vertical-align:middle;}
</style>
</head>
<body>
<div style="width:60%; height:40%; border:red 1px solid; text-align:center; position:absolute;">
<i></i>
<div class="box">afdafd</div>
</div>
追问
实在很接近了... 不过, 外面的container ( 红色那个 ) 本身没有在页面置中...
只有 "box" 在 container 入面置中... 可以再修改一点点吗 ?
追答
如果你需要让外层DIV垂直居中的话必须要用JS。外层DIV的高度用百分比的情况，必须要把DIV定义为绝对定位，所以让DIV垂直居中是无法实现的（里面DIV垂直居中的方法）。固定高度的话就可以实现垂直居中了。你用这种效果做什么，有点不符合实际应用吧。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
哥们，你要是急用的话，建议不要纠结div还是表格了。div垂直居中就差不多是个bug，另外不用js你想获得当前窗口的宽、高，这个想法有点天真，好吧，坐等高手，文字垂直居中还是建议使用table，
<table class="layer"border="0">
<tr>
<td valign="middle" height="100px">居中的文字在</td>
</tr>
</table>
真希望纯css能解决你这个问题
<table class="layer"border="0">
<tr>
<td valign="middle" height="100px">居中的文字在</td>
</tr>
</table>
真希望纯css能解决你这个问题
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这个必须是要用js来动态改变文字大小的。要么你用css控制改变文字大小？
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
div{position:absolute;top:50%;left:50%;overflow:hidden;margin:-20% 0 0 -30%;}
追问
不幸... 这就是我本来的写法, 不过在 ie 里不行, 当做文字缩放时, 整个 table 会向上逃跑了.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
