纯css 让图片等比例缩放

怎么利用css实现图片等比里缩放，下面是两种可以实现让css等比里缩放的方法：

操作方法

  • 01

    第一种方法：利用max-width设置最大宽度来控制 网页代码： <div class="box"><img src="images/1.jpg" /></div> CSS样式： .box {width:500px}.box img {max-width:500px} 备注：缺点，该方法不支持ie6.

  • 02

    第二种方法： 网页代码： <div class="box"><img src="images/1.jpg" /></div> css代码： .box {width:750px;}.box img {max-width:100%; width:expression(this.width > 750 ? "750px" : this.width); max-height:5000px; height:expression(this.height > 5000 ? "5000px" : this.height);}

赞 (0)

相关推荐

  • 如何利用css实现图片等比例缩放

    本篇介绍如何利用css实现图片等比例缩放. 操作方法 01 给图片的img标签设置width或者height的任意一个,图片会自动等比例缩放.如图. 02 打开浏览器查看效果如图. 03 可以使用CS ...

  • CSS背景图片background-image缩放如何居中显示?

    有时候我们想通过CSS使背景图片background-image居中显示,但是发现CSS语法并没有提供background-align:center这样的用法,这篇教程详细地讲解了CSS背景图片bac ...

  • 如何用Ps等比例缩放图片

    有时候我们图片太大,需要缩放图片,但是我们经常导致照片比例变得不一致了,如何解决呢?接下来教你等比例缩放图片. 操作方法 01 首先打开"ps",左键单击"文件" ...

  • PS 怎么等比例缩放

    方法: 1.用PS软件打开图片,双击图层进行解锁. 2.之后,按CTRL+T打开"自由变换". 3.左手按住Shift键,右手用鼠标点击图片的一角,进行拖动,即成等比例缩放.

  • i排版微信编辑器怎么等比缩小图片 等比例改变图片大小教程

    i排版是一款支持文本.图片.动图等编辑内容的微信编辑工具,该款工具支持各种文本的排版和编辑,最近有网友反应i排版不知道怎样等比例缩小图片,那么i排版怎么等比缩小图片呢?接下来就跟随小编一起来看看下面的 ...

  • AI中路径描边效果等比例缩放制作教程

    AI中路径描边效果等比例缩放制作教程

    相信很多小伙伴都有在使用AI,那么在其中我们将路径的描边效果等比例缩放呢?方法很简单,下面小编就来为大家介绍.具体如下:1. 下图所示的松针就是利用描边效果实现的,画笔选用的是"艺术画笔&q ...

  • 电脑ps软件内怎么对图片进行等比例缩放

    电脑ps软件内怎么对图片进行等比例缩放

    当我们在使用电脑的时候,可以利用ps软件来处理图片,那么如果想要使用ps软件来对图片进行等比例缩放的话,应如何操作呢?接下来就由小编来告诉大家.一.创建文档1. 第一步,打开电脑中的ps软件,然后将需 ...

  • ps照片如何等比例缩放？

    今天小编要和大家分享的是ps照片如何等比例缩放,希望能够帮助到大家. 操作方法 01 首先在我们的电脑桌面上找到PS并点击它,如下图所示. 02 然后新建一个带有图片的图层,如下图所示. 03 接着点 ...

  • 怎样让照片等比例缩放

    今天小编要和大家分享的是怎样让照片等比例缩放,希望能够帮助到大家. 操作方法 01 首先在我们的电脑桌面上找到美图秀秀批处理并点击它,如下图所示. 02 然后点击添加多张图片,如下图所示. 03 接着 ...