0

私はこの記事http://www.sitepoint.com/using-unprefixed-css3-gradients-in-modern-browsers/を読んでいました。この記事が教えていることのこの小さなデモを作成しました。

<html>
    <head>
        <title>Css Gradients</title>
        <style>
            .demo{
                height: 200px;
                width: 400px;
                margin-bottom: 10px;
                background: linear-gradient(to right,red,yellow);
                /*background: linear-gradient(23deg,red,yellow);*/
            }
            #radial{
                /*background: radial-gradient(at center,red,yellow);*/
                background: radial-gradient(circle closest-corner,red,yellow);
            }
        </style>
    </head>
    <body>
        <div class="demo"></div>
        <div class="demo" id="radial"></div>
    </body>
</html>

問題は、Firefox では背景のグラデーションが正しくレンダリングされているのに、Google Chrome (バージョン 22) では背景のグラデーションがまったくレンダリングされないことです。スクリーンショットを参照してください。 ファイアフォックスクロム

4

1 に答える 1

0

現時点では(Chrome 24 / Safari 6)Webkitは、プレフィックスなしのcss3グラデーションのサポートをまだ追加していません。IE10(!)でさえ、接頭辞のない構文をすでに使用しているという事実を考えると、これは少し悲しいことです。

参照:http ://caniuse.com/#search=grad

于 2012-11-03T13:44:41.883 に答える