帮助中心

帮助中心 » 其他相关 » banner图自适应电脑分辨率 图片不变形

页码: 1

banner图自适应电脑分辨率 图片不变形

- help 2022-10-19 06:17

一般情况下作插入图片的时候,第一反应就是用img标签,但插入图片的大小与电脑的分辨率不同的时候,就会产生图片平铺整个页面,或者在页面下方出现滚动条,这在写页面的时候都是不可以出现的差错。所以在插入广告图的时候,不建议使用img插入图片的方法。
插入banner图的时候,选择插入背景图最为合适。默认的背景图是从左到右显示的,当分辨率不够大的时候,页面会自左向右显示一部分,所以还需要给图片添加居中向上的显示位置,才能够保证图片居中显示。
————————————————
banner图

代码 复制 - 运行

<style type="text/css">
.banner_box{
min-width: 5px;
height: 86px;
background: url("../111/pc-banner1.jpg");
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
</style>

banner图片位置

代码 复制 - 运行

<dir class="banner_box"></div>

页码: 1