教程集 www.jiaochengji.com
教程集 >  脚本编程  >  javascript  >  正文 css 背景图片自动缩放实例

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的时候将高度按比例缩放。

原文来自:应用开发笔记

您可能感兴趣的文章:

[关闭]
~ ~