jQuery.imgAutoSize：图片自适应大小（以宽度）+…

李勇为您分享jQuery.imgAutoSize插件，解决图片自适应大小（以宽度）的问题，附图片垂直居中的方法。这里不用css处理图片自适应大小，那法子不太符合w3c标准，感兴趣的同学自行百度。

jQuery.imgAutoSize：图片自适应大小（以宽度）+图片垂直居中

jQuery.imgAutoSize：图片按宽度自适应大小

使用方法：

$('.imgWrap').imgAutoSize();

注意事项：

1、如果要控制图片与容器的边距，如30像素： $('.imgWrap').imgAutoSize(30);
2、 .imgWrap这个是图片外部容器，使用了本插件后超大的图片宽度将会限制在容器宽度。

强迫症！图片也垂直居中（文字也适用）

一般来说，按照上面的方法就能很好的达到预期效果了，我是个有强迫症的人，没办法，垂直方向也居中吧。。。　　

*{margin:0 auto}
.midWrap{display:table-cell;vertical-align:middle;width:200px;height:200px;line-height:200px/*文字/图片垂直居中*/}
.imgWrap{display:block;max-width:100%}

注意事项：

1、html中img标签不要设置width和height；
2、css中line-height需要定义宽度和高度，不要忘记设置行高；
3、img要放在div盒子里，否则无效；
4、文字垂直居中.midWrap中需要加入这条属性vertical-align:middle。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有