ErisCyan / minerva
Transfer to URL with SHA Find file
Newer
Older
minerva / Base / res / html / misc / background-repeat-test.html
@minerva minerva on 13 Jul 2 KB Initial commit
Raw Blame History 
<style>
    body {
        background: cyan;
    }
    iframe {
        width: 200px;
        height: 200px;
    }
    .float {
        float: left;
    }
    .background {
        background: white url(background-repeat.png);
        width: 200px;
        height: 200px;
    }
</style>
<body>
    <h1>Body Background</h1>
    <div style="overflow: hidden">
        <div class=float>
            <h2>repeat</h2>
            <iframe src="background-repeat.html"></iframe>

            <h2>repeat-x</h2>
            <iframe src="background-repeat-x.html"></iframe>
        </div>
        <div class=float>
            <h2>no-repeat</h2>
            <iframe src="background-no-repeat.html"></iframe>

            <h2>repeat-y</h2>
            <iframe src="background-repeat-y.html"></iframe>
        </div>
    </div>

    <h1>One-Value Element Background</h1>
    <div style="overflow: hidden">
        <div class=float>
            <h2>repeat</h2>
            <div class=background style="background-repeat: repeat"></div>

            <h2>repeat-x</h2>
            <div class=background style="background-repeat: repeat-x"></div>
        </div>
        <div class=float>
            <h2>no-repeat</h2>
            <div class=background style="background-repeat: no-repeat"></div>

            <h2>repeat-y</h2>
            <div class=background style="background-repeat: repeat-y"></div>
        </div>
    </div>

    <h1>Two-Value Element Background</h1>
    <div style="overflow: hidden">
        <div class=float>
            <h2>repeat repeat</h2>
            <div class=background style="background-repeat: repeat repeat"></div>

            <h2>repeat no-repeat</h2>
            <div class=background style="background-repeat: repeat no-repeat"></div>
        </div>
        <div class=float>
            <h2>no-repeat no-repeat</h2>
            <div class=background style="background-repeat: no-repeat no-repeat"></div>

            <h2>no-repeat repeat</h2>
            <div class=background style="background-repeat: no-repeat repeat"></div>
        </div>
    </div>
</body>