欢迎访问:常州市武进区嘉泽中心小学网站 !今天是:
栏目列表
您现在的位置是:首页>>教师>>计算机技术>>网站制作技术>>文章内容
在HTML页面中设置表格水平和垂直方向都居中的方法【原创】。
发布时间:2008-11-20   点击:   来源:本站原创   录入者:佚名
 

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

    (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>

    效果演示:


附件:
    关闭窗口
    打印文档
    账号登录
    保持登录 忘记密码?
    账号与武进教师培训平台同步