JS控制图片宽度，当高度太高，宽度居然自己变？
这是Jquery: <script src="jquery-3.3.1.js"></script> <script> $(document).ready(function () { $("img").css("width", screen.availWidth + "px"); }); $(document).ready(function () { $("img").css("height", "700px");//这行是关键,运行为图一。当这行都注释，结果是//图二 }); </script> <style> * { margin: 0; padding: 0; border: 0; } </style><body> <img src='任意一张图片，宽度很大，高度很大'></body>
这两个图片是Google浏览器的调试。body和img宽度一模一样都是availWidth。但是问题的图二明显有滚动条，超出了可用宽度。
注意：高度没超过availHeight，宽度就不会超过availWidth。
我图片的宽度都是screen.availWidth。但是图二的宽度似乎超出了屏幕。
追答首先，当高度超出availHeight，就会自动出现纵向的滚动条，这个不用解释吧？
然后，纵向的滚动条肯定要占用位置，这样它就会自动覆盖掉图片最右边的一小部分，这个也能理解吧？
既然图片被覆盖掉了，那么横向滚动条也就跟着出来了啊，不对吗？
也就是说，图片的宽度实际上没有改变，仍然是availWidth，被骗的只是你的眼睛而已！
把body的滚动条取消掉你就会明白了：
body {overflow:hidden}
