【CSS】border-top-left-radius - 左上角の曲線
CSSのborder-top-left-radiusプロパティをご紹介します。
border-top-left-radius
border-top-left-radiusは要素の左上角の曲線を示すプロパティです。
基本構文
border-top-left-radius: 水平の軌道長半径 垂直の軌道長半径;
値が1つのみの場合は水平と垂直の軌道長半径に同じ値を適用します。
サンプル
サンプル1
<style>
div {
width: 100px;
height: 100px;
border: 1px solid black;
border-top-left-radius: 40px;
}
</style>
<div></div>
サンプル2
<style>
div {
width: 100px;
height: 100px;
border: 1px solid black;
border-top-left-radius: 20px 40px;
}
</style>
<div></div>