JS控制图片宽度，当高度太高，宽度居然自己变？

JS控制图片宽度，当高度太高，宽度居然自己变？

这是img标签的特性决定的，如果width和height属性只设置其中一个，另一个会自动等比例缩放，也就是说图片会自动保持其原始的宽高比，只有width和height同时设置，图片才会产生压扁或拉高的变形效果。追问我图片的宽度都是screen.availWidth。但是图二的宽度似乎超出了屏幕。追答首先，当高度超出availHeight，就会自动出现纵向的滚动条，这个不用解释吧？

然后，纵向的滚动条肯定要占用位置，这样它就会自动覆盖掉图片最右边的一小部分，这个也能理解吧？
既然图片被覆盖掉了，那么横向滚动条也就跟着出来了啊，不对吗？
也就是说，图片的宽度实际上没有改变，仍然是availWidth，被骗的只是你的眼睛而已！

把body的滚动条取消掉你就会明白了：
body {overflow:hidden}

img宽度和高度只设置一个的话，它是等比例缩放的，比如说只设置了宽度，那么就会按照原来的宽度和设置的宽度等比例来缩放，就像是放大和缩小，图片不会变形，如果宽度和高度都设置了，才会按照设置的拉伸，这种图片会变形