Question

我的桌子/网页宽1250像素，居中。但对于像我这样的1024px宽显示器，我必须向右滚动才能看到整个页面。我希望它以我的尺寸分辨率为中心，所以我不必滚动。

这是我的代码：

<html>
<head>
<title>blah</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<table id="Table_01" width="1250" height="1500" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td rowspan="8">
            <img src="images/site_layout_01.gif" width="148" height="1500" alt=""></td>
        <td colspan="9">
            <img src="images/header-image.jpg" width="968" height="336" alt=""></td>
        <td rowspan="8">
            <img src="images/site_layout_03.gif" width="134" height="1500" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/site_layout_04.gif" width="968" height="71" alt=""></td>
    </tr>
    <tr>
        <td rowspan="2">
            <img src="images/site_layout_05.gif" width="42" height="201" alt=""></td>
        <td>
            <img src="images/review1.jpg" width="195" height="84" alt=""></td>
        <td rowspan="2">
            <img src="images/site_layout_07.gif" width="40" height="201" alt=""></td>
        <td>
            <img src="images/review2.jpg" width="195" height="84" alt=""></td>
        <td rowspan="2">
            <img src="images/site_layout_09.gif" width="40" height="201" alt=""></td>
        <td>
            <img src="images/review3.jpg" width="195" height="84" alt=""></td>
        <td rowspan="2">
            <img src="images/site_layout_11.gif" width="40" height="201" alt=""></td>
        <td>
            <img src="images/review4.jpg" width="195" height="84" alt=""></td>
        <td rowspan="2">
            <img src="images/site_layout_13.gif" width="26" height="201" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="images/site_layout_14.gif" width="195" height="117" alt=""></td>
        <td>
            <img src="images/site_layout_15.gif" width="195" height="117" alt=""></td>
        <td>
            <img src="images/site_layout_16.gif" width="195" height="117" alt=""></td>
        <td>
            <img src="images/site_layout_17.gif" width="195" height="117" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/main-image.jpg" width="968" height="161" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/site_layout_19.gif" width="968" height="9" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/obama_quote.gif" width="968" height="63" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/site_layout_21.gif" width="968" height="659" alt=""></td>
    </tr>
</table>
</body>
</html>

我如何实现这一目标？

Answer 1

使用以下css

#Table_01{
      margin:0 auto;
      width:1250px;
}

如果您想将此代码用于学习目的，可以，但通用标准说保持960 px.

Answer 2

您可以将表格最小宽度设置为1025px和100％。即使这样你也需要滚动，因为没有办法在较小的玻璃内放置较大的玻璃。

#Table_01 {
  width: 100%;
  max-width: 1680px;
  min-width: 1025px;
}

<强>更新根据您更新的问题，我猜您希望将每侧的相等边距设置为113px。你可以使用以下方法做到这一点。

#Table_01 {
    margin: 0 113px 0 113px;
}

Answer 3

首先关闭，放弃桌面上已弃用的属性。通过CSS正确应用它们。然后添加一个随屏幕大小而变化的媒体查询

#Table_01{margin:0 auto; width:1250px}
@media only screen and (max-width:1024px) { #Table_01{width:1024} }

或者您可以设置宽度：100％

Answer 4

一个糟糕但可行的解决方案如下：您在桌面上设置宽度并将其居中（width: 1250px; margin: 0 auto;） - 这将使桌子居中于高分辨率监视器上。然后，您可以在overflow-x: hidden元素上设置body（因为没有包装器） - 这将阻止水平滚动条出现。

Answer 5

我有同样问题的表必须在屏幕的中心，我找到了下面的解决方案。

您可以直接在表格中添加相同的行：

<table style="margin: auto;">

中心表（表格宽度＆gt;屏幕分辨率）

5 个答案: