6

放射状グラデーションの背景を作成するために、次のような CSS コードを使用しています。

body
{
background-color:   #0176A0;
background-image:   -moz-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   -webkit-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   -o-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   -ms-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
background-image:   radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
filter:             progid:DXImageTransform.Microsoft.gradient(startColorstr = '#029CC9', endColorstr = '#005077', GradientType = 0);
}

しかし、結果は意図したものではありません! 私の目的は、ビューポート全体をカバーする放射状のグラデーションの背景を持つことです。CSS3 仕様の一部であるプロパティを使用しbackground-sizeてより良い結果を得ることができますが、残念ながらこのプロパティは IE では機能しませんか?
誰かアイデアを教えてください。

4

2 に答える 2

11

これを CSS に追加します。

html {
    height: 100%
}
于 2012-04-19T16:45:20.687 に答える
10

さらに良い：

html {
    min-height: 100%;
}

これにより、グラデーションがコンテンツの高さまで拡張されます。それ以外の場合は、ウィンドウの高さだけに制限されます。

于 2013-08-05T14:51:17.097 に答える