0

我将正文宽度设置为 1920px 并设置相同宽度的背景图像。该图像用于标题。因为我的身体内部有更窄的包装，如果我将标题背景放在标题本身，标题背景的宽度会被包装的边框切割。所以我把它放在正文中，但现在我在底部有水平滚动条，页面的中心向右移动。我怎样才能摆脱那个滚动条并使页面居中？这是代码：

body {
    background-color: #f6f6f6;
    background-image: url('../img/menu-background.png');
    width: 1920px;
    background-repeat: no-repeat;
    font-family: 'PT Sans';
}

.wrapper {
    width: 950px;
    min-height: 1658px;
    border: 1px solid grey;
    margin: 0 auto;
}

header a {
    text-decoration: none;
    text-align: center;
    display: block;
    width: 365px;
    margin-left: auto;
    margin-right: auto;
}

和 HTML：

<body>
    <div class="wrapper">
        <header>
            <a href="#">
                <h1>Lorem ipsum</h1>
                <span>bla-bla-bla</span>
            </a>
        </header>
4

2 回答 2

3

您不需要将 body 上的宽度指定为 1920px。

具有较大分辨率屏幕的用户无论如何都会看到整个背景图像。

我建议将您的背景图像标签设置在这样的一行上：

body {
    background: #f6f6f6 url('../img/menu-background.png') no-repeat center 0;
}
于 2013-02-21T14:53:29.600 回答
2

overflow-x:hidden;您可以通过添加到您的身体来防止滚动条

于 2013-02-21T14:57:37.287 回答