html静态页面图片显示大小异常
日期：2014-05-17 浏览次数：20859 次
html静态页面图片显示大小错误
在html中使用css控制一个图片的大小css中的值是百分比，为什么页面中显示有时候是自己想要的效果有时候现实的很小呢？
请求各位大神帮忙啊
------解决方案--------------------
你要搞清楚是相对于谁的百分比，
比如
1000的50%是500
100的50%才是50
具体大小是根据容器的大小决定的
------解决方案--------------------
那楼主写的IMG百分比，应该是以下两种情形之一：
1.
<body>
<img style="width:50%">
</body>
2.
<body>
<div style="width:50%">
<img style="width:50%">
</div>
</body>
也许实际上可能有更多的容器嵌套，但归根结底是所有容器从开始相比于body，一直到IMG，都是这样下来的。而且BODY本身没有设置一个固定宽度。
所以最终IMG的百分比计算得到的实际值，就取决于当前浏览器窗口所给BODY的实际值。因此，浏览器窗口如果改变尺寸，图片就会改变尺寸。
又或者浏览器窗口没有改变尺寸，但IMG外部容器是相对于一个在不同情况下会改变尺寸的容器，所以引起图片尺寸有所不同。
------解决方案--------------------
楼主给这个IMG所在容器加个BORDER，在你所说的不同情况下观察一下，就能看出是什么问题导致IMG外部容器的尺寸发生变化了。
在html中使用css控制一个图片的大小css中的值是百分比，为什么页面中显示有时候是自己想要的效果有时候现实的很小呢？
请求各位大神帮忙啊
------解决方案--------------------
你要搞清楚是相对于谁的百分比，
比如
1000的50%是500
100的50%才是50
具体大小是根据容器的大小决定的
------解决方案--------------------
那楼主写的IMG百分比，应该是以下两种情形之一：
1.
<body>
<img style="width:50%">
</body>
2.
<body>
<div style="width:50%">
<img style="width:50%">
</div>
</body>
也许实际上可能有更多的容器嵌套，但归根结底是所有容器从开始相比于body，一直到IMG，都是这样下来的。而且BODY本身没有设置一个固定宽度。
所以最终IMG的百分比计算得到的实际值，就取决于当前浏览器窗口所给BODY的实际值。因此，浏览器窗口如果改变尺寸，图片就会改变尺寸。
又或者浏览器窗口没有改变尺寸，但IMG外部容器是相对于一个在不同情况下会改变尺寸的容器，所以引起图片尺寸有所不同。
------解决方案--------------------
楼主给这个IMG所在容器加个BORDER，在你所说的不同情况下观察一下，就能看出是什么问题导致IMG外部容器的尺寸发生变化了。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
