14.CSS - 테두리외각선

테두리 각각에 색깔을 사용 할 수 있습니다.
이곳 예제에서는 border와 button의 테두리 색상과 선 모양을 바꿔 보겠습니다.

---

     예제1) 각각의 테두리에 두깨와 모양, 색깔 설정하는 예제 입니다.
     테두리  두깨 설정;             테두리 선 모양 설정;                  테두리 선 색깔
   border-left-width:1px;       border-left-style:solid;          border-left-color:Red;
   border-top-width:1px;       border-top-style:dotted;        border-top-color:Blue;
  border-right-width:1px;     border-right-style:groove;     border-right-color:Green;
border-bottom-width:1px; border-bottom-style:dashed; border-bottom-color:Black;

14-1 (예제1)

---

     예제2) 각각의 테두리가 아닌 테두리 전체를 설정하는 예제 입니다.

border-width:2px; border-style:dotted; border-color:Red;

---

     예제3) 예제2를 간단하게 작성 할 수 있습니다.
border:groove 1px gray; -> 테두리 전체, 모양 , 두깨 , 색상

---

14.테두리외각선.htm