网页设计中图片按比例缩小

1、在网页上放图片，怎么让它按比例缩放？

鼠标上的滚轮 把鼠标放在图片上 上转是放大 下转是缩小

2、如何把网页里面的内容等比例缩小

把网页里面的内容缩小的方法比较简单，其方法如下：

1、在IE浏览器的右下角找到百分比显示的地方，如图：

2、在弹出的调节窗口选择你所需要的比例，要缩小可以选择百分之七十五、百分之六十等，根据你的需要选择即可立即实现。选择比例的地方如图。

3、html中图片等比例缩放

style里你可以设max-width: 400px;

4、网页中控制图片缩放比例

在处理网页图片时，特别是一些图片列表的应用里面，很难保证图片统一大小，直接设置图片大小又会导致图片拉伸，造成图片模糊，本文介绍的代码可以在图片加载完成后自动按比例调整图片大小。
Javascript：
<
script
language="javascript"
type="text/javascript">
<
!--
//
说明：用
JavaScript
实现网页图片等比例缩放
//
整理：
http://www.CodeBit.cn
function
DrawImage(ImgD,FitWidth,FitHeight)
{
var
image=new
Image();
image.src=ImgD.src;
if(image.width>0
&&
image.height>0)
{
if(image.width/image.height>=
FitWidth/FitHeight)
{
if(image.width>FitWidth)
{
ImgD.width=FitWidth;
ImgD.height=(image.height*FitWidth)/image.width;
}
else
{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
else
{
if(image.height>FitHeight)
{
ImgD.height=FitHeight;
ImgD.width=(image.width*FitHeight)/image.height;
}
else
{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
}
//-->
<
script>
调用方式：
Code:
<
img
src="1148202890.jpg"
alt="自动缩放后的效果"
onload="javascript:DrawImage(this,200,200);"
/>
如果图片较大，建议在图片标签里面同时设置期望的图片大小，这样不会导致页面在加载中撑开，该大小不会影响最终缩放效果。可以修改上面的代码为：
Code:
<
img
src="1148202890.jpg"
alt="自动缩放后的效果"
width="200"
height="200"
onload="javascript:DrawImage(this,200,200);"
/>

5、html图片如何按屏幕大小等比例缩放

html图片按屏幕大小等比例缩放若浏览器允许可按Ctrl+鼠标滚轮滑动缩放，或用代码。

6、css 可以按比例缩放图片吗？

解决这个问题的方法如下：

1、先在html里添加一个img图片标签。

2、运行页面后，这是完整显示图片大小的。图片大概是400x260左右的大小。

3、要进入图片缩放，可以在css样式里设置图片的宽度和高度，但不要宽和高都设置了，比如这里都设置为100px。

4、设置后，看下页面可以看到图片现在变形了。

5、正确的方法应该是只设置其中一个，比如设置宽度为100px，高度设置为自动就行了。

6、这里设置后的效果，图片并没有变形。

7、同样，如果是限定高度的大小，就设置宽度为自动，图片同样不会变形，这样问题就解决了。

7、怎样按比例缩小图片

▲图片尺寸修改方法：

方法一： photoshop，是常用的图片编辑软件，论坛中即有下载。
具体步骤如下：
步骤一：用 photoshop软件打开所要编辑的图片文件。点击标题栏--图象--图象大小。
步骤二：在图象大小的弹出对话框中，填写具体尺寸，一般来说，600*400，或者400*600的文件大小比较适合网页的浏览习惯。注意，要将约束比例一栏打勾。
步骤三：完成操作，保存文件。点击文件-保存为--，在保存为的弹出对话框中，填写文件名，以及要保存的地址，保存。
步骤四：此时，会出现jpeg的对话框，移动选择条，将文件品质调整为10，最佳。确定。

方法二： 如果您的电脑上没有安装photoshop软件，还有一个简单的办法。就是使用windows系统自带的画图软件，点击系统的开始--所有程序--附件--画图。
步骤一：打开你所要编辑的文件。点击标题栏--图象--拉伸/扭曲--弹出窗口，如下图。在拉伸栏中填写相应缩小比例，注意，水平和垂直栏一定要填写相同大小。以2048*1536的图片尺寸而言，填写30%的比例，缩小后图片为600*400，大小适中。
图片要从大向小调整，避免发生缩小后再放大的情况，图片的画面质量将被破坏。如果您觉得图片调整过于小了，请重新打开文件再缩小，而不是在已经缩小的图片上做放大处理，切记。
步骤二：保存。特别提示大家，尽量使用“另存为”，以免对原图片发生修改。

8、html中怎么把图片按比例缩放在<span>里面

首先，你使用span元素并不是很合理，因为span元素是行元素，不能够设置宽高

如果一定要使用span元素，需要设置宽高，之后对图片进行处理

将span元素调整为块元素（设置display: block），赋予固定的宽度或百分比

之后为图片设置宽度和高度，宽设置为100%，即可让图片等比例进行缩放，宽度等于span的宽度，高度会等比例变化

.box {
    display: block;
    width: 200px;
}
.box img {
    width: 100%;
}

9、我想实现在html页面中显示一个图片,可以根据用户的浏览器的大小改变进行图片的等比例缩放，该怎么实现呢？

css：width 和 height 用百分比表示。
或者通过 js 获得浏览器大小，再改变样式

10、CSS的问题：图片按比例缩小

<img src="1.jpg" style="max-width:150px;" />

是按比例缩小的.

估计你的图片 样式 还受其它的 样式干扰，