0

私はCSSとHTMLに非常に慣れていないので、これのCSSバージョンを作成しようとしています:

http://i.stack.imgur.com/JNgUb.jpg

4 つの異なる色で 4 つの div を正常に作成しましたが、これが私の結果です。

http://i.imgur.com/ihYblSv.png

ページ全体に収まるように div をスケーリングするにはどうすればよいですか?

私のコードは次のとおりです。

    body{
    background-color: #eae1c8;
    }
    #bg {
    transform:rotate(30deg);
    -webkit-transform:rotate(30deg);
    -moz-transform:rotate(30deg);
    -ms-transform:rotate(30deg);
    -o-transfrom:rotate(30deg);
}

#blue {
    height: 25%;
    background-color: #9dd2b5;
}
#green {
    height: 25%;
    background-color: #6aa427;
}
#yellow {
    height: 25%;
    background-color: #f0b747;
}
#orange {
    height: 25%;
    background-color: #de5b1e;
}
4

2 に答える 2

0

回転する前にページ全体に収まります。

ページ全体を占めるようにしたい場合は、ページ本体 { オーバーフロー: 非表示; 次に、スペースを埋めるために div のサイズで遊んでください。#bg { 高さ: 160%; を設定します。各色を 40% にして、それがどのように機能するかを確認します。

于 2013-07-24T20:23:39.473 に答える