css - 本体の 2 つの背景: 背景の高さを設定する方法

Question

私はこのコードを持っています：

body{
    margin: 0px;
    padding: 0px;
    background-image: url(images/header.png), url(images/footer.png);
    background-repeat: repeat-x, repeat;
    background-height: 50px , 400px; /* ?? */
    background-position: 0% 0%, 0% 100%;

}

特定の高さで繰り返される高さを footer.png に指定できますか?

Answer 1

あなたが試すことができますbackground-size：

body{
    margin: 0px;
    padding: 0px;
    background-image: url(images/header.png), url(images/footer.png);
    background-repeat: repeat-x, repeat-x;
    background-size: auto, auto 500px; // here give to background images height
    background-position: 0% 0%, 0% 100%;


}

についての詳細background-size はこちらです。

Answer 2

別の div を作成して指定することをお勧めします。

body {
    margin: 0px;
    padding: 0px;
    background-image: url(images/header.png), ;
    background-repeat: repeat-x;
    background-height: 50px , 400px; 
    background-position: 0% 0%, 0% 100%;
    div {
        background-image: url(images/footer.png);
        background-repeat: repeat;
        background-height: 50px , 400px;
    }
}