ltscript language=quotJavaScriptquot lt！ 图片按比例缩放 var flag=falsefunction DrawImageImgD var image=new Imagevar iwidth = 180 定义允许图片宽度 var iheight = 180 定义允许图片高度 image。

纯HTML没办法做到自动缩放，至于JS我就不清楚了我这边推荐HTML两种方法1同时制作手机端PC端IPAD端三张背景图片根据不同环境调用2只做一张图，利用backgroundimage的backgroundsize属性来适应屏幕，如下代。

html图片按屏幕大小等比例缩放若浏览器允许可按Ctrl+鼠标滚轮滑动缩放，或用代码具体方法如下Ctrl+鼠标滚轮滑动缩放 css代码与htlm代码 CSS 代码如下background position fixedtop 0left 0width 100%heigh。

1新建html文档，在body标签中添加一张图片，给这张图片设置css属性，添加“tansform”缩放属性，属性值为“scaleXn”，scaleXn指的是对宽度进行缩放，n指的是缩放比例2将transform的属性值改为“scaleYn”。

ltimg src=zhidaogif width=100% height=50% 使用以上代码插入图片，就会按浏览器窗口大小缩放也可以使用javascript对图片大小进行改变。

无级缩放图片大小 function bbimgo var zoom=parseInt， 10100zoom+=eventwheelDelta12if zoom0 =zoom+#39%#39return false ltSCRIPT 在图片属性加上onmousewheel=quot。

这种布局一般都是写固定宽度和高度的如果真的根据屏幕大小自动缩放图片，会更难看的ltstyle*margin0padding0bg_5clearbothwidth630pxheight140pxbg_5 lifloatleftliststylewidth125。

1首先，先在代码中输入positionfixed top 0 left 0这样的作用是让整个图片固定在屏幕上2之后，再把背景图片的大小自动适应DIV大小，当图片自动适应时，既可以就进行缩放3输入backgroundsize cover。

img display block position absolute top 50% left 50% transform translate3d50%，50%，0 webkittransform translate3d50%，50%，0。

可以通过backgroundsize属性来设定背景图片的大小它可以是像素px或者是百分比%，举例说明backgroundsize950px*200px这表示把背景图片大小调整为宽度950像素，高度200像素1backgroundsize的语法说明1属性。

2为img标签单独设置“width”或“height”属性，属性值为宽度或者高度，这时图片的宽度将变成设置的宽度，高度将会按原比例进行缩放 3同时为img标签设置“width”和“height”属性，这时图片的大小将会完全按照设置的大小。

css3中新增了一个属性 transform scale可以对图片进行放大 缩小 比如transformscale05，表示引用该样式的内容进行了缩小了一半，反之，如果括号里面的值为15那么表示 内容放大了15倍做一个示例演示。

首先你知道宽度的大小吧，比如不同设备宽度，然后由于图片外面的div高度是由图片高度决定的，所以div，可以设置maxminheight，然而图片在只设置width的时候，height是等比例缩放的。

图片可以设置百分比，根据窗口的大小自动缩放，字体不能自动缩放除非用@media screen给不同的窗口大小写不同的字体大小样式。

要使HTML文本适应图片的大小，可以使用CSS中的`backgroundsize`属性和`backgroundimage`属性以下是一个示例代码```html ltdiv style=quotbackgroundimage url#39yourimageurl#39 backgroundsize contain width。

一种是JS抓取浏览器的resize事件，另外一个，新单位，低版本浏览器不兼容 1vw = 当前视图窗口viewport1%的宽度 1vh = 当前视图窗口viewport1%的高度 1vmin = 1vw 或 1vh， 取决于哪个更小一点 1vmax = 1vw。