CSS方式水平对齐表 [英] CSS way to horizontally align table

问题描述

我想在浏览器窗口中央显示固定宽度的表格。现在我使用

 < table width =200align =center>但是Visual Studio 2008在这一行上给出警告：
 
 
 
 
 
 
 
 $ b b 
 属性align被视为过时。建议使用较新的结构。
 
 
 
我应该将哪些CSS样式应用到表格以获得相同的布局？
解决方案
 Steven是对的，在理论中： 
 
 
使用CSS将表格居中的正确方式。如果左边距和右边距相等，则符合的浏览器应该将表格居中。最简单的方法是将左边距和右边距设置为auto。因此，可以在样式表中写入：
 
 
 
 
 
  table 
 {
 margin-left：auto; 
 margin-right：auto; 
} 
  
但在本回答开头提到的文章给了你所有的其他方式
 
 
优雅的css跨浏览器解决方案：
这适用于MSIE 6（Quirks和Standards） ，Mozilla，Opera甚至Netscape 4.x没有设置任何显式宽度：
 
 
 
 
 
  centered 
 {
 text-align：center; 
} 
 
 div.center table 
 {
 margin：0 auto; 
 text-align：left; 
} 
 
 
< div class =centered> 
< table> 
 ... 
< / table> 
< / div> 
  
 
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屋！