Box Model 設計-邊框(二)

陳育霖

邊框屬性簡易表示
border-top、border-right、border-left、border-bottom、border

1. #fig1 { border: solid thin};
   
2. #fig2 { border: inset thin yellow};

複製代碼

邊框圓角 border-radius
border-top-left-radius: 長度一 長度二
第一個為水平軸半徑、第二個為垂直軸半徑
border-radius: 長度一 長度二 長度三 長度四

1. #fig1 { border: solid 5px gray; border-radius: 20px 5px; }

複製代碼

四個值：左上、右上、右下、左下
三個值：左上、左下右上、右下
兩個值：左上右下、右上左下
一個值：上下左右