Question

首先，我想感谢你们所有人的回答。我通过网站作为学生和工作从我的项目中找到了很多解决方案。

我在问这个问题之前经常搜索，但我找不到合适的解决方案。

对不起标题。想不出更好的一个。

我尝试开发一个网站，我的标题有问题。主页面容器的修复大小为1024px，内部内容限制为960px。只有页眉和页脚占据了窗口的全部权力。

我有两个图像：第一个是2000x250（后面的建筑物），第二个是2000x58（带房屋的语言）。让我们分别命名为img_A和img_B。我希望他们两个都根据用户的分辨率（如页脚）来控制整个屏幕，但也可以根据高度进行缩放。

问题在于我想要无论屏幕分辨率是多少，img_B都要在1024px内居中，所以ES按钮将位于主页面的末尾（1024px），因此徽标是以0为自动边距为中心;不要盖房子。

这里有一些图片可以更好地说明我的要求。

错误（1920x1200）：

http://imageshack.us/photo/my-images/577/headerwrong.jpg/

对（1680x1050）：

http://imageshack.us/photo/my-images/20/headercorrect.jpg/

这是我的css代码：

#header{
    height: 140px;
    width: 100%;
    background: url(images/background_home.jpg) center center no-repeat;
}

#header .language_banner{
    background: transparent url(images/header_en.png) right bottom no-repeat;
}

#header .logo{
    display:block; 
    width:242px; 
    margin:0 auto;
    padding-top: 63px;
}

和html代码：

<div id="header">
    <div class="language_banner">
        <div class="logo">
            <img alt="athens insiders" src="<?php    bloginfo("template_directory"); ?>/images/logo.png">
        </div>
    </div>
</div>

提前致谢

Answer 1

我不太明白你想要实现的目标，但我想你想尝试（并添加！）背景大小的css（也许是背景剪辑）定义背景后，属性为#header（或任何位置）。

请注意，早期版本的IE中没有支持，因此如果要实现通用兼容性，可能需要另外解决。

背景图像宽度为100％居中以固定位置

1 个答案: