html - 背景画像を縦に伸ばす

Question

縞模様の画像 (幅 62 ピクセル、高さ 32 ピクセル) を含む単純な CSS を使用して Web ページを作成し、ページの下部まで垂直方向に繰り返すようにしたいと考えています。私の問題は、「テスト」を入れると非常に小さくなるなど、コンテンツの最後で停止することです。エッセイ全体がある場合は、それを繰り返しますが、ページがスクロールしない場合はそれほど多くはありません.

画像: http://avaworld.net/images/bordLeft-blue.png

ウェブサイト - http://www.avaworld.net/

#blueWrap { margin: 0; background-color: #131313; padding: 0; display: block; }

#blueRight { padding-right: 62px; background: url(http://avaworld.net/images/bordRight-blue.png) top right repeat-y; }

#blueLeft { padding-left: 62px; background: url(http://avaworld.net/images/bordLeft-blue.png) top left repeat-y; }

<div id="blueWrap">
    <div id="blueRight">
      <div id="blueLeft">
        Test
     </div>
    </div>
</div>

Answer 1

これをcssに適用します

body, #blueWrap, #blueRight, #blueLeft{height:100%;}

Answer 2

の問題body, #blueWrap, #blueRight, #blueLeft{height:100%;}は、コンテンツが多い場合、スクロール中に要素blueRightとblueLeft要素がページをたどらないことです。

blueRight属性と属性についてはblueLeft、css に以下を追加してみてください。position: fixed; height: 100%;

position: fixed;divは、スクロールしてもその正確な位置にとどまることを意味します。

height: 100%;高さを100％にすることです。