[css] border-style 종류

#border

- 테두리를 만드는 속성. 위,오른쪽,아래,왼쪽선을 한번에 정한다.


선언방식

div{
/*한번에 3가지 동시 선언*/
	border: solid 3px black; 
/*따로 선언*/    
	border-width:15px;
  	border-style:solid;
  	border-color:red;
}

  • border-width : 선의 두께를 정한다. (픽셀 단위 )
  • border-style : 선의 모양을 정한다.(기본 none(없음))
  • border-color : 선의 색을 정한다.

 

border-style 종류

solid | dashed | dotted | double | groove | ridge | inset | outset | hidden | none | 


하나의 속성에 여러값 선언

#div1{
  border-width:10px;
  border-style:solid;
  border-color:orange;
}
#div2{
  border-width:10px 20px;
  border-style:solid double;
  border-color:orange purple;
}
#div3{
  border-width:10px 15px 20px;
  border-style:solid double dashed;
  border-color:orange purple lime;
}
#div4{
  border-width:15px;
  border-color:orange purple plum lime;
}

 

 

댓글

Designed by JB FACTORY