CSS에서 Ul 및 Li의 목록 스타일 유형 속성에 대한 자세한 설명

참조:

list-style-type사용법

구문: ​​
list-style-type: 디스크 | 원형 | 하위 로마자 | 상위 알파 | | 아르메니아어 | 하급 그리스어 | 히라가나 | 가타카나 - 라틴어 | 값:

원: CSS1 속이 빈 원
사각형: CSS1 속이 빈 정사각형
소수: CSS1 아라비아 숫자
lower-roman: CSS1 소문자 로마 숫자
upper-roman: CSS1 대문자 로마 숫자
lower-alpha: CSS1 소문자 영문자
upper- alpha: CSS1 대문자 영문자
none: CSS1은 글머리 기호를 사용하지 않습니다
armenianl: CSS2는 지원되지 않습니다. 전통적인 아르메니아 숫자
cjk-ideographic : CSS2에서는 지원되지 않습니다. 연한 흰색 표의 문자 숫자
조지아어: CSS2에서는 지원되지 않습니다. 전통적인 조지 숫자
lower-greek : CSS2에서는 지원되지 않습니다. 기본 그리스어 소문자
hebrew : CSS2에서는 지원되지 않습니다. 전통적인 히브리어 숫자
히라가나: CSS2에서는 지원되지 않습니다. 일본어 히라가나 문자
hiragana-iroha: CSS2에서는 지원되지 않습니다. 일본어 히라가나 일련번호
가타카나: CSS2에서는 지원되지 않습니다. 일본어 가타카나 문자
katakana-iroha : CSS2에서는 지원되지 않습니다. 일본어 가타카나 일련 번호
lower-latin: CSS2에서 지원되지 않습니다. 라틴 소문자
upper-latin : CSS2에서는 지원되지 않습니다. 라틴 대문자

---------------

LI 코드 형식 지정:

A) CSS를 사용하여 목록 기호 형식 지정:

ul li{ 
list-style-type:none; 
}

B). 목록 기호를 이미지로 변경하려면

ul li{ 
list-style-type:none; 
list-style-image
: url(images/icon.gif); 
}

C) 왼쪽 정렬의 경우 다음 코드를 사용할 수 있습니다.

ul{ 
list-style-type:none; 
margin
:0px; 
}

D) 목록에 배경색을 추가하려면 다음 코드:

ul{ 
list-style-type: none; 
margin:0px; 
} 
ul li{ 
background
:#CCC; 
}

E ) MOUSEOVER 배경 변색 효과를 목록에 추가하려면 다음 코드를 사용할 수 있습니다.

ul{ list-style-type: none; margin:0px; } 
ul li a{ 
display
:block; width: 100%; background:#ccc; } 
ul li a:hover{ background:#999; }

참고: 표시할 수 있도록 이 줄을 추가해야 합니다. 블록 형식으로!

F).LI의 요소는 수평으로 배열되며 키는 FLOAT:LEFT:

ul{ 
list-style-type:none; 
width:100%; 
} 
ul li{ 
width:80px; 
float:left; 
}

위 내용은 CSS에서 Ul 및 Li의 목록 스타일 유형 속성에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!