css 背景图片高度固定宽度自适应并且图片不变形

程序员文章站 2022-05-01 08:12:37

...

图片大小为1920*636，为了适应在小屏幕上背景图不变形展示，会自动裁剪两边。

<div id="banner">
</div>

<style>
#banner{
    width: 100%;
    height: 636px;
    background-image: url(../images/banner.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1920px 636px;
}
</style>