Question

如何使用css水平拉伸图像的内容。 alt text

//html code

        <style>
html, body{
    margin: 0;
    padding: 0;

}


    #cont {
    width:100%;
    height:125px;

    background-color:#1ea1de;
    }

    .logo {
        height:100px;
        width:300px;
        background: url(logo3.png) no-repeat;
        margin-top:-105px;
    }
    #liniq {
        height:2.5px;
        width:100%;
        background-color: #b5babc;
        margin-top:5px;
    }
    #levo {
        background: url(levo.gif) no-repeat;
        width:64px;
        height:104px;
        margin-left:280px;
        margin-top:-170px;

    }
    #middle {
        background:url(middle.gif) repeat-x;
        height:41px;
        margin-top:-62px;
        margin-left:321px;
        border:1px solid red;
        overflow:hidden;

    }
</style>
</head>

<body>

<div id="cont"></div>
<div class="logo"></div>
<div id="liniq"></div>

<div id="buttons">

<div id="levo"></div>
<div id="middle"></div>
</div>
</body>
</html>

但它不会根据内容延伸......

Answer 1

我不了解图片，但似乎你正在尝试拉伸背景图片，如果不使用CSS3属性background-size，这是不可能的。

无论如何，您可以将图片放在html应用width:100%中，其高度会自动调整大小。

（并且width:100%对于块元素没用）

根据内容css拉伸图像

1 个答案: