개요
HTML List item 요소 (<li>
) 는 리스트 항목을 나타낼때 사용됩니다. 이 요소는 자신이 리스트에서 하나의 개체를 나타내는 정렬된 리스트(<ol>
), 정렬되지 않은 리스트(<ul>
), 메뉴(<menu>
) 에 포함되어야 합니다. 메뉴와 정렬되지 않은 리스트에서, 리스트 항목들은 일반적으로 글머리 기호와 함께 표시됩니다. 정렬된 리스트에서는, 숫자나 글자가 내림차순으로 왼쪽에 같이 표시됩니다.
- 컨텐츠 범주 없음.
- 허용된 컨텐츠 플로우 컨텐츠
- 태그 생략 종료 태그는 자신 바로 뒤에 다른
<li>
요소가 따라오거나, 부모 요소 안에 더 이상 다른 요소가 없을경우 생략될수 있습니다. - 허용된 부모 요소
<ul>
,<ol>
,<menu>
요소.
적합하지 않은 사용 방법이지만, 폐기된<dir>
도 부모가 될수 있습니다. - DOM 인터페이스
HTMLLIElement
속성
이 요소는 전역 속성를 포함합니다.
value
- 이 정수 속성은
<ol>
요소 내부의 항목의 현재 서수 값을 나타냅니다. 리스트가 로마 숫자나 문자로 표시되더라도 이 속성에는 숫자만 넣을수 있습니다. 이 속성이 지정된 리스트 항목 뒤를 따르는 다른 항목들은 여기서 지정된 값에서부터 번호가 매겨집니다. value 속성은 정렬되지 않은 리스트 (<ul>
)와 메뉴(<menu>
)에서는 아무 의미가 없습니다.Note: 이 속성은 HTML4에서 사용되지않음 되었지만, HTML5에서 재도입 되었습니다.Note: Gecko 9.0 이전에는 음수 값들이 비정상적으로 0으로 변환되었습니다. Gecko 9.0 에서부터는 모든 정수값들이 올바르게 변환됩니다
type
- 이 문자 속성은 넘버링 타입을 나타냅니다.
a
: 소문자 글자A
: 대문자 글자i
: 소문자 로마 숫자I
: 대문자 문자 숫자1
: 숫자
<ol>
요소에서 사용된 타입을 오버라이드 합니다.사용 참고: 이 속성은 deprecated 되었습니다. 대신에 CSSlist-style-type
속성을 사용하세요.
예제
<ol> <li>first item</li> <li>second item</li> <li>third item</li> </ol>
위 HTML의 결과:
- first item
- second item
- third item
<ul> <li>first item</li> <li>second item</li> <li>third item</li> </ul>
- first item
- second item
- third item
더 많은 자세한 예제를 보고 싶다면, <ol>와 <ul> 페이지를 참조해주세요.
사양
사양 | 상태 | 주석 |
---|---|---|
WHATWG HTML Living Standard The definition of '<li>' in that specification. |
Living Standard | |
HTML5 The definition of '<li>' in that specification. |
Recommendation | |
HTML 4.01 Specification The definition of '<li>' in that specification. |
Recommendation |
브라우저 적합성
기능 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Yes) | 1.0 (1.7 or earlier) | (Yes) | (Yes) | (Yes) |
기능 | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | (Yes) | 1.0 (1.0) | (Yes) | (Yes) | (Yes) |
같이 보기
- 다른 리스트 관련 요소들:
<ul>
,<li>
,<menu>
와 폐기된<dir>
; <li>
요소를 스타일하기 위해 CSS 속성이 특별히 유용할 수 있습니다 :- the
list-style
property, to choose the way the ordinal is displayed, - CSS counters, to handle complex nested lists,
- the
margin
property, to control the indent of the list item.
- the