css图片压缩_如何在HTML中用CSS对图片进行缩放

① 如何用DIV+CSS控制图片大小范围

使用CSS max-width和max-height实现图片自动等比例缩小
很简单我们要使用到max-width和max-height,这样即可设置对象图片最大宽度和最大高度，这样图片就会等比例缩放图片，然图片相对不变形清晰。
使用max-width:300px或max-height:100px，即可解决图片比例缩小。但这样存在一个问题，如果按照宽度缩放，但图片过高会超出溢出盒子，这个时候需要对父级使用overflow:hidden隐藏超出图片内容。但是使用max-width或max-height，IE6不支持，我们需要设置个width:expression(this.width > 300 ? "300px" : this.width);或者height:expression(this.height>100?"100px":this.height);。

解决IE6支持max-height

div css解决IE6支持max-width

一般情况下只需要设置好宽度限制，比如这里只设置最大宽度为300px(max-width:300px),然后对父级使用overflow:hidden隐藏溢出图片，同时为了兼容IE6我们设置个width:expression(this.width > 300 ? "300px" : this.width);解决即可。

1、具体解决DIV+CSS实例代码如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>图片缩小不变形实例 www.divcss5.com</title>
<style>
.divcss5{ border:1px solid #000; width:300px; height:100px;overflow:hidden}
.divcss5 img{max-width:300px;_width:expression(this.width > 300 ? "300px" : this.width);}
</style>
</head>
<body>
<div class="divcss5">

② 如何在HTML中用CSS对图片进行缩放

可以用css3中“transform: scale()”属性对图片进行缩放。

1、新建html文档，在body标签中添加一张图片，给这张图片设置css属性，添加“tansform”缩放属性，属性值为“scaleX(n)”，scaleX(n)指的是对宽度进行缩放，n指的是缩放比例：

③ css 图片高度怎么设置才不会变形,被压缩

设置图片自适应，给图片设置display:block;width:100%;不要设置高度，不要设置高度，不要设置高度。这样图片就能根据父级div适应大小，就是你设置一个div，里面放图片。div多大，图片就多大。高度自动适应，所以不能设置高度。

④ 如何用div+css压缩图片

给你一个过程你看下
<%
dim arr(3)
dim upload,file,formName,formPath,iCount,filename,fileExt,i
set upload=new upload_5xSoft ''建立上传对象

formPath="../upImgFile/" '图片存放的路径：proct目录下的uploadimages文件夹 ''在目录后加(/)

''列出所有上传了的文件
for each formName in upload.file
set file=upload.file(formName)
if file.filesize>0 then
if file.filesize>10000000 then
response.write "<font size=2>图片大小超小了限制[<a href=# onclick=history.go(-1)>重新上传</a>]</font>"
response.end
end if
fileExt=lcase(right(file.filename,4))
if fileExt<>".jpg" then
response.write "<font size=2>文件格式限制[<a href=# onclick=history.go(-1)>请重新上传</a>]</font>"
response.end
end if
end if

filename=year(now)&month(now)&day(now)&hour(now)&minute(now)&second(now)&file.FileName

if file.FileSize>0 then ''如果 FileSize > 0 说明有文件数据
file.SaveAs Server.mappath(formpath&filename) ''保存文件

' 图片位置
dim PhotoPath
PhotoPath = Server.MapPath(formpath&filename)
'缩小大图
call OKbigpic(PhotoPath)

'response.write file.FilePath&file.FileName&"("&file.FileSize&") => "&formPath&File.FileName&"上传成功<br>"
response.write "上传成功 <a href=# onclick=history.go(-1)>请返回</a>"

end if
set file=nothing
next
set upload=nothing
Response.Write "<script>parent.add.P_url.value='"&FileName&"'</script>"

sub OKbigpic(FileName)
Dim bigpic,bigpicPath,fss
Set bigpic = Server.CreateObject("Persits.Jpeg")
set fss=createobject("scripting.filesystemobject")
' 设置图片质量
bigpic.Interpolation=2
bigpic.Quality=90
' 图片位置
if fss.fileExists(FileName) then
bigpic.Open FileName

'下面是按比例缩放
n_MaxWidth=900
n_MaxHeight=1500

'按比例取得缩略图宽度和高度
Dim n_OriginalWidth, n_OriginalHeight '原图片宽度、高度
Dim n_BuildWidth, n_BuildHeight '缩略图宽度、高度
Dim div1, div2
Dim n1, n2
'修改Jpeg
n_OriginalWidth = bigpic.Width
n_OriginalHeight = bigpic.Height
div1 = n_OriginalWidth / n_OriginalHeight
div2 = n_OriginalHeight / n_OriginalWidth
n1 = 0
n2 = 0
If n_OriginalWidth > n_MaxWidth Then
n1 = n_OriginalWidth / n_MaxWidth
Else
n_BuildWidth = n_OriginalWidth
End If
If n_OriginalHeight > n_MaxHeight Then
n2 = n_OriginalHeight / n_MaxHeight
Else
n_BuildHeight = n_OriginalHeight
End If
If n1 <> 0 Or n2 <> 0 Then
If n1 > n2 Then
n_BuildWidth = n_MaxWidth
n_BuildHeight = n_MaxWidth * div2
Else
n_BuildWidth = n_MaxHeight * div1
n_BuildHeight = n_MaxHeight
End If
End If

'指定宽度和高度生成
bigpic.Width = n_BuildWidth
bigpic.Height = n_BuildHeight

' 保存文件
bigpic.Save (FileName)
' 注销对象
Set bigpic = Nothing

end if
end sub
%>

⑤ css 背景图片怎么压缩不重复平铺

IE11+应该支持的，其他就别想了。

⑥ css div 尺寸被压缩了怎么办

你有几个单词不认真写错了

li{list-style-type:none;}
#c3{margin-top:33px;clear:both;}
#c3.c3{float:left;width:300px;overflow:hidden;}
#c3.c3-center{margin:auto50px;}
#c3.c3.header{height:34px;overflow:hidden}
#c3.c3.header.title{line-height:24px;font:"微软雅黑",Arial18px;color:#333;float:left;width:220px;padding-bottom:7px;border-bottom:#fd80002pxsolid}
#c3.c3.header.titlespan{color:#fd8000;}
#c3.c3.header.more{float:left;width:80px;overflow:hidden;height:32px;border-bottom:#3537481pxsolid;}
#c3.c3.header.moreaimg{border:0;float:right;display:block;margin-top:4px;}
#c3.c3.content{margin:44px0px25px0px;}
#c3.c3.contentp{text-indent:28px;font-size:14px;line-height:24px;margin:0px;padding-top:25px}
#c3.c3.content.abc{font-size:14px;line-height:30px;color:#cacaca;border-bottom:2px#cacacadotted;padding-top:2px;margin:0;padding-left:0;}
#c3.c3.content.abc.abc1{color:#cacaca;line-height:25px}
#c3.c3.content.date{font-size:14px;line-height:34px;color:#cacaca}
#c3.c3.content.date.date1{line-height:25px;margin-top:3px}

⑦ css 背景图片从中间压缩

这个可以调整整张背景图片的位置，把整个网页的背景图做成一张png图片，然后控制位置即可。

⑧ css 背景图片从中间压缩（如图）

把背景图片重新做一下处理，分为两张图。
<ul>
<li><h4>首页</h4></li>
</ul>
li背景设为左端把左端尽量做长一点， h4标签的背景设为右端居右不重复

⑨ background-image背景图片怎么用css缩小

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

⑩ html/css 网页背景图片，如何自适应宽度，长度不压缩 div如何半透明详解

导航:首页 > 文件处理 > css图片压缩

css图片压缩

与css图片压缩相关的资料