CSS

[CSS] Border

katia 2023. 3. 8. 15:42

Border

  • 요소의 테두리를 지정하기위해 사용한다.
  • 속성구조
    • [x] [y] [z] : 테두리의 굵기로 x를, 모양으로 y를, 색상으로 z를 사용한다.
  • 기본값 : none
  • 속성값
    • 굵기에 대해 [크기]
    • 모양에 대해
      • dashed : 긴 점선
      • dotted : 점선
      • double : 이중 실선
      • solid : 실선
    • 색상에 대해 [색상]

Border-top

  • 위쪽 테두리를 지정하기 위해 사용한다. 용법은 border 와 동일함.

Border-right

  • 오른쪽 테두리를 지정하기 위해 사용한다. 용법은 border 와 동일함.

Border-bottom

  • 아래쪽 테두리를 지정하기 위해 사용한다. 용법은 border 와 동일함.

Border-left

  • 왼쪽 테두리를 지정하기 위해 사용한다. 용법은 border 와 동일함.

Border-radius

  • 요소의 테두리를 둥글게 한다. 속성 값은 [크기] 로, 둥글게 만들 원의 반지름이다.
  • 높이가 명확하지 않은 요소에 대해 캔디 모양으로 만들기 위해서는 해당요소가 절대 도달할 수 없는 크기를 지정한다.
  • 속성값 : [크기]
  • 기본값 : 0
[Tag] or [.class] or [#id]{
     border : [선굵기 : 크기] [모양] [색상];
     border-radius : [크기];
}

'CSS' 카테고리의 다른 글

[CSS] Display  (0) 2023.03.08
[CSS] Overflow  (0) 2023.03.08
[CSS] Filter (이미지 필터)  (0) 2023.03.08
[CSS] Width(가로) 과 Height(세로)  (0) 2023.03.08
[CSS] Cursur(마우스 커서 변경)  (0) 2023.03.08