This page was translated from English by the community.Learn more and join the MDN Web Docs community.
<ul>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015년 7월.
HTML<ul> 요소는 정렬되지 않은 목록을 나타냅니다. 보통 불릿으로 표현합니다.
시도해 보기
<ul> <li>Milk</li> <li> Cheese <ul> <li>Blue cheese</li> <li>Feta</li> </ul> </li></ul>li { list-style-type: circle;}li li { list-style-type: square;}| 콘텐츠 카테고리 | 플로우 콘텐츠. 또한, 최소 하나의<li> 요소를 자식으로 둔다면뚜렷한 콘텐츠. |
|---|---|
| 가능한 콘텐츠 | 0개 이상의<li>,<script>,<template> 요소. |
| 태그 생략 | 불가능, 시작과 끝에 태그를 추가하는 것은 필수입니다. |
| 가능한 부모 요소 | 플로우 콘텐츠를 허용하는 모든 요소. |
| 가능한 ARIA 역할 | directory,group,listbox,menu,menubar,radiogroup,tablist,toolbar,tree,presentation |
| DOM 인터페이스 | HTMLUListElement |
특성
이 요소는전역 특성만 포함합니다.
compact지원이 중단되었습니다This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute depends on theuser agent, and it doesn't work in all browsers.
경고 :Do not use this attribute, as it has been deprecated: useCSS instead. To give a similar effect as the
compactattribute, the CSS propertyline-heightcan be used with a value of80%.type지원이 중단되었습니다This attribute sets the bullet style for the list. The values defined underHTML3.2 and the transitional version ofHTML 4.0/4.01 are:
circlediscsquareA fourth bullet type has been defined in the WebTV interface, but not all browsers support it:
<code>triangle`.If not present and if noCSS
list-style-typeproperty applies to the element, the user agent selects a bullet type depending on the nesting level of the list.경고 :Do not use this attribute, as it has been deprecated; use theCSS
list-style-typeproperty instead.
사용 일람
보통 비정렬 목록의 항목은 선행하는 불릿마커와 함께 표시합니다.
<ul>과<ol>은 필요한 만큼 중첩할 수 있고, 서로 교차할 수도 있습니다.
<ul>과<ol>은 모두 목록을 나타냅니다. 차이가 있다면<ul>에서는 순서가 중요하지 않다는 점입니다. 항목의 순서를 바꿨을 때 의미도 바뀐다면<ol>을 사용하세요. 그렇지 않으면<ul>을 사용할 수 있습니다.
예제
간단한 예제
<ul> <li>first item</li> <li>second item</li> <li>third item</li></ul>중첩 목록
<ul> <li>first item</li> <li> second item <!-- Look, the closing </li> tag is not placed here! --> <ul> <li>second item first subitem</li> <li> second item second subitem <!-- Same for the second nested unordered list! --> <ul> <li>second item second subitem first sub-subitem</li> <li>second item second subitem second sub-subitem</li> <li>second item second subitem third sub-subitem</li> </ul> </li> <!-- Closing </li> tag for the li that contains the third unordered list --> <li>second item third subitem</li> </ul> <!-- Here is the closing </li> tag --> </li> <li>third item</li></ul>비정렬 목록 안의 정렬 목록
<ul> <li>first item</li> <li> second item <!-- Look, the closing </li> tag is not placed here! --> <ol> <li>second item first subitem</li> <li>second item second subitem</li> <li>second item third subitem</li> </ol> <!-- Here is the closing </li> tag --> </li> <li>third item</li></ul>명세
| Specification |
|---|
| HTML # the-ul-element |
브라우저 호환성
같이 보기
- 리스트 관련 다른 요소:
<ol>,<li>,<menu> <ol>요소와 유용하게 사용할 수 있는 CSS 속성- 서수를 표현할 방식을 지정하는
list-style속성. - 복잡한 중첩 목록을 처리하기 위한CSS 카운터
- 더 이상 사용하지 않는
compact특성을 대체할 수 있는line-height - 항목의 들여쓰기를 조정하기 위한
margin속성.
- 서수를 표현할 방식을 지정하는