6

幅と高さの半径を 200px にするにはどうすればよいですか? これはピクセル単位で実行できると読みましたが、すべての試みが失敗しました。

background-image: -webkit-radial-gradient(75% 100%, circle farthest-corner, #ffffff, #ff7ae9 33%);
background-image: -o-radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%);
background-image: -ms-radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%);
background-image: radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%)
background-image: -moz-radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%);
4

1 に答える 1

7

編集：明確にするためにすべてのベンダープレフィックスを追加しました

background-image:    -moz-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image: -webkit-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image:      -o-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image:     -ms-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image:         radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);

この例では、「200px」が円のサイズです。px、em、パーセンテージなどの標準的な CSS 単位で問題ありません。

「50px 100px」は円の中心の位置です。これはbackground-positionと同じように機能するため、「左上」などの値も問題ありません。

すべてのベンダー固有のプレフィックスに役立つオンライン ジェネレーターがいくつかあります。

ps
@Mohsen ピクセル値は問題ありません。MDNは次のように述べています。

0% から 100% の間のパーセンテージ、またはグラデーション軸に沿った長さ

「長さ」をクリックすると、

長さの CSS 構文は、数値の直後に単位が続きます。数字と単位の間にスペースを入れることはできません。

于 2011-09-22T17:03:31.533 に答える