본문 바로가기
  • search_ _ _ _
  • search_ _ _ _
  • search_ _ _ _
html+css

list-style 속성

by 오늘의갈비찜 2021. 4. 24.
728x90
list-style 모든 list-style 속성을 이용한 스타일을 한 줄에 설정할 수 있음.

ex)  ul { list-style: square inside url("/examples/images/img_list_marker.png"); }
list-style-type 리스트 요소의 마커(marker)를 설정함.
circle : 속이 빈 원형
square : 속이 채워진 사각
upper-alpha : 알파벳 대문자
lower-roman : 아라비아 숫자

ex) .circle { list-style-type: circle; }
list-style-image 리스트 요소의 마커로 사용할 이미지를 설정함.

ex) .imageMarker { list-style-image: url("/examples/images/img_list_marker.png"); }
list-style-position 리스트 요소의 위치를 설정함.

   outside: 기본 속성값은 outside로 설정되어 있다.

   inside: 안으로 리스트 들여쓰기

ex)  .inside { list-style-position: inside; }

 

출처:

tcpschool.com/css/css_basic_lists

728x90

'html+css' 카테고리의 다른 글

Image Sprite 속성  (0) 2021.04.24
table 속성  (0) 2021.04.24
link 속성  (0) 2021.04.24
font 속성  (0) 2021.04.24