css-list

목록을 표현하는 태그는 <li>입니다.

 

<ol>

<li>List</li>

<li>Set</li>

<li>HashMap (Dictionary)</li>

<li>Queue</li>

<li>Stack</li>

<li>Tree</li>

<li>Sorting</li>

<li>Search</li>

</ol>

 

목록에서 List, Set, HashMap.. Search까지 목록아이템 하나하나를 <li>태그로 감싸줍니다.

그리고, 목록 전체를 <ol> 태그로 감싸줍니다.

 

<ol>은 ordered list라는 의미로,

결과화면과 같이 목록에 숫자를 달아줍니다.

왼쪽 결과 화면을 보면, 우리는 숫자를 쓰지 않았는데 자동으로 numbering 되었네요.

 

하지만 우리가 원하는 것은 자동으로 numbering 되는 것이 아닙니다.

ol 대신에 numbering이 되지 않는 ul 태그를 사용하겠습니다.

 

<ul>태그는 unordered list라는 의미입니다.

숫자 없는 목록을 표현해줍니다.

 

<ul>

<li>List</li>

<li>Set</li>

<li>HashMap (Dictionary)</li>

<li>Queue</li>

<li>Stack</li>

<li>Tree</li>

<li>Sorting</li>

<li>Search</li>

</ul>

 

이제는 목록 아이템 앞에 작은 원이 생겼습니다.

이렇게 브라우저는 태그에 따라 스타일을 부여합니다.

 

 

 

아무 스타일도 넣고 싶지 않다고 li태그만 사용하면 안 됩니다.

목록은 항상 ul이나 ol태그로 감싸야 합니다.