【问题标题】:Align the table on the center of the page对齐页面中心的表格
【发布时间】:2014-05-30 23:03:48
【问题描述】:

我只想把表格放在页面中间。任何帮助都会很棒。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Randy's first html web page !</title>
<style type="text/css">
body
{background-image:url('Koala.gif');} 
h1
{
text-align:center;
}
h2
{
text-align:center;
}
p
{
text-align:center;
font-size:200%;
color:#00fff0;
}
div
{
background-color:#efffff;
}
</style>
</head>
<h1> Hello Professor</h1>
<h2> By: Randy White</h2>
<P> I haven't done anything like this before.</P> 
<P>Seems to be ok</P>
<P><img src="Hydrangeas.jpg" width="150" height="100" alt="Hydrangeas.jpg"></P> 
<table border="1">
<tr>
<th>Month</th>
<th>Day</th>
<th>Year</th>
</tr>
<tr>
<td>December</td>
<td>1</td>
<td>2010</td>
</tr>
</table>
<a href="http://www.google.com">Visit Google!</a>
</body>
</html>

【问题讨论】:

    标签: html css


    【解决方案1】:

    试试:

    table {
        width: 50%;
        margin-left: auto;
        margin-right: auto;
    }
    

    或:

    table {
        width: 200px;
        margin-left: auto;
        margin-right: auto;
    }
    

    顺便说一句,这为所有表设置了这个。您可能希望在更具体的选择器上拥有这些属性(例如 table.someclass)。

    【讨论】:

    • 这似乎不起作用。也许我把它放在不正确的地方。你能告诉我这会去哪里吗?
    • 我的小错误,我希望它太短 ;) 现在试试,有效。
    【解决方案2】:

    旧样式是 align="center":

    <table width="400" border="0" cellspacing="0" cellpadding="0" align="center">
    

    【讨论】:

      【解决方案3】:

      要在页面中间水平对齐表格,并自动使表格宽度适合自己,请尝试以下操作:

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

      【讨论】:

        猜你喜欢
        • 2013-11-27
        • 2020-10-29
        • 1970-01-01
        • 2012-12-31
        • 2019-10-14
        • 2016-11-25
        • 2012-02-15
        • 1970-01-01
        • 2012-08-15
        相关资源
        最近更新 更多