CSS的方法来水平对齐表 [英] CSS way to horizontally align table

问题描述

我要显示的固定宽度的表在浏览器窗口的中心。现在我用

 ＆LT;表格的宽度=200ALIGN =中心＆GT;
 

但是，Visual Studio 2008中提供了有关该行警告：

属性对齐被认为是过时的。较新的结构建议。的

我应该申请表什么CSS样式来获取相同的布局？

解决方案

史蒂芬是正确的，在理论：

  

正确的方式来使用CSS居中的表。符合浏览器应该居中表，如果左，右页边距相等。 自动完成此操作的最简单的方法是设置左，右页边距因此，人们可以在样式表中写的：

 表
{
    保证金左：自动;
    保证金权：汽车;
}
 

但这个答案的开头提到的文章给你所有的其他方式居中的表。

  

这是优雅的CSS跨浏览器的解决方案：   这在两个MSIE 6（怪癖和标准），Mozilla中，歌剧，甚至Netscape 4.x版本不设置任何明确的宽度：

  div.centered
{
    文本对齐：中心;
}

div.centered表
{
    保证金：0汽车;
    文本对齐：左;
}


＆LT; D​​IV CLASS =中心＆GT;
    ＆LT;表＆gt;
    ...
    ＆LT; /表＆gt;
＆LT; / DIV＆GT;
 

I want to show a table of fixed width at the center of browser window. Now I use

<table width="200" align="center">

But Visual Studio 2008 gives warning on this line:

Attribute 'align' is considered outdated. A newer construct is recommended.

What CSS style should I apply to the table to obtain the same layout?

解决方案

Steven is right, in theory:

the "correct" way to center a table using CSS. Conforming browsers ought to center tables if the left and right margins are equal. The simplest way to accomplish this is to set the left and right margins to "auto." Thus, one might write in a style sheet:

table
{ 
    margin-left: auto;
    margin-right: auto;
}

But the article mentioned in the beginning of this answer gives you all the other way to center a table.

An elegant css cross-browser solution: This works in both MSIE 6 (Quirks and Standards), Mozilla, Opera and even Netscape 4.x without setting any explicit widths:

div.centered 
{
    text-align: center;
}

div.centered table 
{
    margin: 0 auto; 
    text-align: left;
}


<div class="centered">
    <table>
    …
    </table>
</div>

这篇关于CSS的方法来水平对齐表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！