在HTML页面中设置表格水平和垂直方向都居中的方法【原创】。

[入库:2005年8月18日] [更新:2007年3月25日]

本文简介:选择自 ardor007 的 blog

    如果你想要你的网页内容无论在什么分辨率和任意浏览器窗口大小的情况下都处于浏览器中间的话,你可以把你的网页内容全部放在一个表格之中,然后把这个表格设置为垂直和水平方向上都居中。具体方法如下:

    (1)先在在页面最外层加一个表格(一行一列),将其高度设置为100%,宽度设置为100%或者是合适的象素值,并将表格设为居中对齐(水平方向上的)。

    (2)在刚才的表格中再添加一个表格(就是你想要在水平和垂直方向上都居中的那个表格),将表格设置为居中对齐(水平方向上的),垂直对齐方向不用设置(因为默认的垂直居中方式就是居中)。

    示例代码如下:

    <!-- test.htm -->

    <html>
    <head>
    <title>表格水平和垂直方向都居中示例。</</title>
    <meta http-equiv=content-type content="text/html; charset=gb2312" >
    </head>

    <body>

    <!-- 外部表格开始 -->
    <table width="760" height="100%" align="center">
        <tr>
            <td>
                <div align="center">
                    <!-- 内部表格开始 -->
                    <table width="200" height="300">
                        <tr>
                            <td></td>
                        </tr>
                    </table>
                    <!-- 内部部表格结束 -->
                </div>
            </td>
        </tr>
    </table>
    <!-- 外部表格结束 -->

    </body>
    </html>

    效果演示:http://lihong.luojia.net/ardor/index2.htm

本文关键:在HTML页面中设置表格水平和垂直方向都居中的方法【原创】。
  相关方案
Google
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top