1

私は（ローカル環境で）960gs を使用しており、この CSS コードをfooterdivに挿入します。

## style.css

#footer{
    background:url("images/footer.png")  repeat-x scroll top transparent; 
    height: 130px; 
    width:100%; 
    overflow:hidden;
}

## footer.php

<div id="footer">   
    <div id="nav" class="container_12">  </div>
    <div id="endfooter" class="container_12">
        <div id="copyright" class="grid_3 alpha"> </div>  
        <div id="design" class="grid_3 omega">  </div>  
    </div> <!-- endfooter -->
</div> <!-- end footer -->

footer問題は、ページがdiv 全体を覆う背景で全幅で div を表示しないことです。960pxで画像を表示するだけです。私が間違っていることは何ですか？

4

1 に答える 1

0

あなたがやろうとしていることを理解するまでに、しばらく時間がかかりました。背景画像を拡大縮小しようとしていますよね？少なくとも CSS2 では、それはできません。背景画像は拡大縮小されません。それらを並べて表示 (繰り返し) することはできますが、拡大縮小することはできません。画像を拡大縮小する場合は、<img>タグを使用する必要があります。

CSS3 標準に依存する意思がある場合は、使用できますbackground-size

#footer{
    background:url("images/footer.png")  repeat-x scroll top transparent; 
    background-size:100% 130px;
    height: 130px; 
    width:100%; 
    overflow:hidden;
}

保証はできませんbackground-sizeが、w3schools は優れたブラウザー サポートを主張しています。

于 2012-12-02T03:17:16.960 に答える