您好,欢迎访问三七文档
当前位置:首页 > 商业/管理/HR > 项目/工程管理 > css控制图片大小的方法
网页制作技巧实例解决:用CSS控制图片自适应大小图片自动适应大小是一个非常常用的功能,在进行制作的时候为了防止图片撑开容器而对图片的尺寸进行必要的控制,我们可不可以用CSS控制图片使它自适应大小呢?可以通过按比例缩小或者放大到某尺寸(自己指定),来保持图片不变形走样的完全显示。解决方案:一、对于标准浏览器(如Firefox),或者最新都IE7浏览器,直接使用max-width,max-height;或者min-width,min-height的CSS属性即可。如:我们想到了一个比较简单的解决方法,虽然不是非常的完美,如果您的要求不是非常高,已经可以满足你的需要了。我们看下面的代码:[css]viewplaincopyprint?1.img{2.max-width:100px;3.max-height:100px;4.overflow:hidden;5.}二、对于IE6及其以下版本的浏览器,则可以利用其支持的expression属性,在csscode中嵌入javascriptcode来实现图片的缩放:[css]viewplaincopyprint?1.img{2.width:expression(this.width150?150px:this.width);3.height:expression(this.height150?150px:this.height);4.}三、完美解决方案[css]viewplaincopyprint?1.img{2.border:0;3.margin:0;4.padding:0;5.max-width:150px;6.width:expression(this.width150?150px:this.width);7.max-height:150px;8.height:expression(this.height150?150px:this.height);9.}
三七文档所有资源均是用户自行上传分享,仅供网友学习交流,未经上传用户书面授权,请勿作他用。
本文标题:css控制图片大小的方法
链接地址:https://www.777doc.com/doc-2907800 .html