【css】角の丸み設定

4角の全てに対応する場合

css



それぞれの角に対応する場合1
水平方向と垂直方向の半径の値を、左上・右上・右下・左下の順に設定します。
/の前が水平方向の左上・右上・右下・左下の設定で、/の後が垂直方向の左上・右上・右下・左下の設定です。
css


それぞれの角に対応する場合2
border-top-left-radius(左上)
border-top-right-radius(右上)
border-bottom-left-radius(左下)
border-bottom-right-radius
で個別設定も可能です。
値を1つしか設定していない場合は、水平、垂直方向療法に反映されます。
値を2つ設定した場合は1つ目が水平、2つ目が垂直方向になります。


css