css 图片自动缩放

 代码如下 复制代码

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>css 图片自动缩放</title>
<style type="text/css">
.imgsize {
width:expression(this.width>78?"78px":this.width+"px");
height:expression(this.height>78?"78px":this.width+"px");
}

/*
兼容ie ,ff,ie7等浏览器做法

*/
max-width: 250px;
max-height: 186px;

width:expression(this.width > 250 ? 250 : true);
height: expression(this.height > 186 ? 186 : true);
   
</style>

</head>

<body>
<img src="/upfile/borough/picture/2010/06/26/20100626010000.jpg"  class="imgsize"/>
<img src="/upfile/borough/picture/2010/07/19/20100719154725.jpg"  class="imgsize"/>

</body>
</html>

 

时间: 2024-10-29 11:28:02

css 图片自动缩放的相关文章

JS+css 图片自动缩放自适应大小_javascript技巧

我加了css的限制: 复制代码 代码如下: div img {}{max-width:600px;width:600px;width:expression(document.body.clientWidth>600?"600px":"auto");overflow:hidden;} ◎ max-width:600px; 在IE7.FF等其他非IE浏览器下最大宽度为600px.但在IE6中无效. ◎ width:600px; 在所有浏览器中图片的大小为600px

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:

Width和height—CSS图片的缩放

CSS图片的缩放:在CSS中图片的缩放是通过width和height两个属性来实现的. Width和height属性:可以设置为相对大小,也可以设置为绝对大小.Width和height属性设置为相对大小时,当拖动缩放浏览器时窗口改变其宽度时,图片的大小也会相应地发生变化.如果仅仅只设置了图片的width属性,而没有设置height属性时,图片本身会自动给纵横比例缩放,如果只设定height属性也是一样的道理.只有当同时高设定width和height属性时才会不等比例缩放. CSS图片的缩放示例:

ASP技巧之让图片自动缩放以适合界面大小

技巧 如何让图片自动缩放以适合界面大小,拿出你的Editplus,打开c_function.asp文件,找到UBBCode函数,在第417行有如下语句 If Instr(strType,"[image]")>0  And ZC_UBB_IMAGE_ENABLE Then  '[img]    objRegExp.Pattern="(\[IMG=)([0-9]*),([0-9]*),(.*)(\])(.+?)(\[\/IMG\])"    strContent=

如何让图片自动缩放以适合界面大小

如何让图片自动缩放以适合界面大小,拿出你的Editplus,打开c_function.asp文件,找到UBBCode函数,在第417行有如下语句   If Instr(strType,"[image]")>0  And ZC_UBB_IMAGE_ENABLE Then  '[img]     objRegExp.Pattern="(\[IMG=)([0-9]*),([0-9]*),(.*)(\])(.+?)(\[\/IMG\])"    strContent=

ASP程序实现图片自动缩放以适合界面大小

程序 如何让图片自动缩放以适合界面大小,拿出你的Editplus,打开c_function.asp文件,找到UBBCode函数 If Instr(strType,"[image]")>0  And ZC_UBB_IMAGE_ENABLE Then  '[img]     objRegExp.Pattern="(\[IMG=)([0-9]*),([0-9]*),(.*)(\])(.+?)(\[\/IMG\])"    strContent= objRegExp.

兼容ie、firefox的图片自动缩放的css跟js代码分享_javascript技巧

这个功能主要是解决内容页中的图片过大撑出,导致页面比较难看,就需要这样的代码,需要的朋友可以参考下 需求:图片width<=600px,height<=800. 1.利用max-width,max-height使图片等比例自动缩放代码: 复制代码 代码如下: img{max-width: 600px;max-height: 800px;} 由于ie6不支持css max-width,max-height,所以在ie6中需要利用javascript脚本来控制大小. 2.用javascript脚本

兼容ie、firefox的图片自动缩放的css跟js代码分享_图象特效

需求:图片width<=330px,height<=150. 1.利用max-width,max-height使图片等比例自动缩放,代码: 复制代码 代码如下: img{max-width: 330px;max-height: 150px;} 由于ie6不支持css max-width,max-height,所以在ie6中需要利用javascript脚本来控制大小. 2.用javascript脚本来兼容ie6,代码如: 复制代码 代码如下: var img_width = img.Offset

css expression 图片自动缩放

我们判断图片超过设置大小时就会自动缩放到指定大小的expression起到关键作用. <style>    .image {        max-width:600px;height:auto;cursor:pointer;        border:1px dashed #4e6973;padding: 3px;        zoom:expression( function(elm) {            if (elm.width>560) {