Question

以下是我以更简单的方式重新创建问题的代码

<html>
    <head>
        <title>test</title>
        <style>
            #container{
                width:500px;
                background-color:green;
            }
            table{
                width:100%;background-color:blue;
            }
            table tr td img{
                max-width:100%;
                width:100%;
            }
        </style>
    </head>
    <body>
        <div id="container" style="">
            <table style="">
                <tr>
                    <td><img src="http://go-grafix.com/data/wallpapers/20/green-574309-3888x2592-hq-dsk-wallpapers.jpg"/></td>
                </tr>
            </table>
        </div>
    </body>
</html>

基本上这在Chrome和其他浏览器中运行良好

但在IE8中，max-width属性未被遵守。我也尝试使用width属性仍然没有运气

有什么建议吗？

P.S：我不想在px中拥有它，我希望仅在%中拥有它

Here是小提琴链接

Answer 1

尝试通过内联方式提供宽度和高度属性

<img width="100" height="100"/>

或

<img style="width:100;height:100"/>

Answer 2

制作响应式图像。只需应用以下样式：

<img src="img/xyz.jpg" class="xyz-img" width="100" height="100" />


<style> .xyz-img{width:100%; height:auto;} </style>

图像不符合IE8中的宽度属性

2 个答案: