[CSS] 목록 관련 스타일

list-style-type

• 불릿기호를 변경해줄때 사용

ul (순서 없는 목록)

선택자 {
    list-style-type : none(자주사용됨) / disc(원) / circle(속이 빈 원) / square;
}

 

ol (순서 있는 목록)

• decimal : 목록 항목을 1부터 시작하는 숫자로 표시
• decimal-leading-zero : 10 미만 숫자에 01부터 시작하는 두 자리 숫자로 표시
• lower-alpha : 알파벳 소문자로 표시
• upper-alpha : 알파벳 대문자로 표시
• lower-roman : 로마 숫자 소문자 (i)로 표시
• upper-roman : 로마 숫자 대문자 (I)로 표시;

선택자{
    list-style-type : decimal/decimal-leading-zero;
    list-style-type : lower-alpha/upper-alpha;
    list-style-type : lower-roman/upper-roman;
}

list-style-position

• inside/outside - 불릿기호의 위치를 조정할 때 사용 (inside는 약간 오른쪽으로 감)

list-style-image

• 불릿기호 대신 이미지를 적용할 때 사용

선택자 {
    list-style-position : inside/outside;
    list-style-image : url(적용시키고자하는 이미지의 경로);
}