css - 我想得到一个完整的图像作为我的标题

标签 css image browser header adjustable

嘿, 我想在浏览器的宽度上获得一个完整的图像作为我的标题。 但问题是,我得到了一个水平滚动条,但我不想要那个。 我想要的是如果浏览器也调整图像调整。 这可以用 css 实现吗? 对不起,我的英语不好。 这是我的代码

#header {
        Margin-left:auto;
        Margin-right:auto;
        heigth:400px;
        position: center center;    
        min-width: 100%;
        max-width: 1024;
}

     <body>
        <div id="header">
            <img src="header.png" />
        </div>

最佳答案

您可以选择将图像设置为背景图像并使用 background-size: cover;像这样:

#header {
    width: 100%; height 400px;
    margin: 0 auto;
    background: url("../header.png");
    background-size: cover;
}

<div id="header"></div>

您可以在此处找到有关背景大小的更多说明: http://www.css3.info/preview/background-size/

关于css - 我想得到一个完整的图像作为我的标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19280717/

相关文章:

css调试渲染前后不一样

image - 如何在 dart 的 canvas2d 中缓存稍后要绘制的图像?

node.js - 通过 Zombie.js 浏览器使用 POST 方法调用 API

css - SVG:是否可以切出一个区域?

javascript - CSS/JavaScript 使用 Div 使页面部分变灰

image - 立方到等角投影算法

屏幕锁定时javascript setInterval暂停(IOS)

html - 在 html 中禁用的链接

html - CSS Grid Column中的元素,上边距表现为位置top

c++ - 使用CPP获取dd图像的十六进制值