CSS List

 list

■ list-style-type

  목록 단추 설명 번호 있는 목록(ordered list) 에서 번호 형태나 번호 없는 목록(unordered list)에서 단추(bullet) 타입을 지정 한다.

  번호 있는 목록(ordered list)에서 번호 형태에서 값 : decimal, lower-roman, upper-roman, lower-alpha, upper-alpha

  번호 없는 목록(unordered list) 에서 단추(bullet) 타입에서 값 : disc, circle, square, none

  예 : ol {list-style-type: lower-roman;} 

        ul {list-style-type: square;}

 

■ list-style-image

  목록 이미지 설명 목록에서 단추(bullet) 타입(image)을 지정한다.

  값 : URL, none

  

  예 : ul {list-style-image: url(bullet.gif);}

■ list-style-position

  목록 번호 위치 설명 목록 기호의 위치를 정한다. 번호 있는 목록(ordered list)에서 번호 위치나 번호 없는 목록(unordered list)에서 단추(bullet) 위치를 지정 한다.

  값 : inside, outside, inside

  

  예 : li {list-style-position: outer;}

■ list-style

  목록 특성 설명 한 번에 목록의 여러 특성 지정.

  가능 한 요소 : list-style-type, list-style-position, url

  

  예 : ul {list-style: square url(bullet.gif) outer;}

■ white-space

  공백 설명 엘레멘트에 흰 공백 지정

  값 : normal, pre, nowrap

        normal : 여러개의 공백을 하나로 만든다.

        pre : 공백을 그대로 나타낸다.

        nowrap : <br/> 없이는 줄 바꿈(Line Wrap)을 허용하지 않음.

  

  td {white-space: nowrap;}

  tt {white-space: pre;}