CSS3 では、「border-radius」属性は丸い角を作成するために使用されます。この属性は、要素の 4 つの丸い角のスタイルを設定するために使用できる短縮属性です。構文は「border-半径: 1-4 長さ|% / 1-4 長さ|%」。
このチュートリアルの動作環境: Windows 10 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
最初に、主に CSS3 属性 border-radius を使用して丸い効果を定義して、丸い境界線を設定します。具体的な構文は次のとおりです:
{ border-raidus : none | length | length ;} パラメータ none はデフォルト値であり、角丸効果がないことを意味します; パラメータ length は構成された長さの値です浮動小数点数とユニット識別子の値を負の値にすることはできません。
2 番目に、2 つの角の半径を指定します。 border-radius プロパティには 2 つのパラメータ値を含めることができます。最初のパラメータ値は丸い角の水平半径を表し、2 番目のパラメータ値は丸い角の垂直半径を表します。2 つのパラメータはスラッシュ (/) で区切られています。
3 番目に、4 つの異なる角を持つ丸い境界線を描きます。 border-radius は、4 つの異なる角を持つ丸い境界線を描画できます。具体的な構文は次のとおりです:
{ border-radius : top-left | top-right |bottom-right |bottom-left ;} パラメーターは次のとおりです。それぞれ、左上隅のフィレット半径、右上隅のフィレット半径、右下隅のフィレット半径、左下隅のフィレット半径を表します。
#4 番目に、円形の境界線を描きます。 border-radius プロパティは、さまざまな半径値に応じてさまざまな丸い境界線を描画したり、完全な円を描画したりすることもできます。 開発者は、独自のニーズに応じて境界半径のサイズを設定できます。 (学習ビデオ共有:css ビデオ チュートリアル)
以上がCSS3で丸い角を作成するために使用されるプロパティは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。