css 背景图片自动缩放实例
发布时间:2023-09-02 编辑:jiaochengji.com
教程集为您提供css 背景图片自动缩放实例等资源,欢迎您收藏本站,我们将为您提供最新的css 背景图片自动缩放实例资源
本文章来给大家介绍css 背景图片自动缩放实例,有需要的朋友可以一起来看看实现方法哦,具体兼容性作者未测试我也不清楚哦。
默认情况下,背景属性是平铺的,如果背景图片较大,而box小,那么就只能显示左上角那块背景.如果要让背景全部显示出来,
代码如下 | 复制代码 |
.color_checked { float: right; width: 16px; height: 16px; background: url(../images/color_check.png) center 0 no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } |
如果你还希望图片自动缩放
代码如下 | 复制代码 |
#blogcon img { max-width: 400px; max-height: 400px; width: expression(this.width>400 && this.width>this.height ? 400 : true); height: expression(this.height > 400 ? 400 : true); } |
这段话的意思解释一下:将id为blogcon标签下面的所有图像img标签的最大宽度设置为400px,最大高度设置为400px,宽度的判断如果图片宽度和高度都大于400的时候将高度按比例缩放。
原文来自:应用开发笔记
您可能感兴趣的文章: