我想在屏幕中央放置一个<div> (或<table> )元素,不管屏幕尺寸如何。 换句话说,留在“顶”和“底”的空格应相等,“右”和“左”两边的空格应相等。 我只想用CSS完成这个。
我尝试了以下,但它不工作:
<body> <div style="top:0px; border:1px solid red;"> <table border="1" align="center"> <tr height="100%"> <td height="100%" width="100%" valign="middle" align="center"> We are launching soon! </td> </tr> </table> </div> </body>注意: 如果<div>元素(或<table> )与网站滚动不是一样好。 只需要在页面加载时居中。
I want to position a <div> (or a <table>) element at the center of the screen irrespective of screen size. In other words, the space left on 'top' and 'bottom' should be equal and space left on 'right' and 'left' sides should be equal. I would like to accomplish this with only CSS.
I have tried the following but it is not working:
<body> <div style="top:0px; border:1px solid red;"> <table border="1" align="center"> <tr height="100%"> <td height="100%" width="100%" valign="middle" align="center"> We are launching soon! </td> </tr> </table> </div> </body>Note: It is either way fine if the <div> element (or <table>) scrolls with the website or not. Just want it to be centered when the page loads.
最满意答案
简单的方法,如果你有一个固定的宽度和高度:
#divElement{ position: absolute; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px; width: 100px; height: 100px; }请不要使用内联样式! 这是一个工作示例http://jsfiddle.net/S5bKq/ 。
The easy way, if you have a fixed width and height:
#divElement{ position: absolute; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px; width: 100px; height: 100px; }Please don't use inline styles! Here is a working example http://jsfiddle.net/S5bKq/.
更多推荐
发布评论