HTML 공부 4 - list(ul, ol)

HTML 태그 중에 list가 있다

 

ul과 ol

 

태그이기 때문에 사용은 <ul></ul>

<ol></ol>로 한다

 

---

UL

unordered list

 

순서가 없는 리스트이다

 

 

<h1>Number one</h1>
<h2>Number two</h2>
<h3>Number three</h3>
<h4>Number four</h4>

 

 

우선 비교를 위해서 이렇게 작성을 하고 html 파일을 열어 확인해보았다.

 

 

 

글자 크기가 다르게 잘 작성 되었다.

 

 

<ul>
  <h1>Number one</h1>
  <h2>Number two</h2>
  <h3>Number three</h3>
  <h4>Number four</h4>
</ul>

 

이제 이렇게 작성하고 html 파일을 열어보았다.

 

 

앞에 공백만 조금 생겼다. 별 차이가 없는데??

 

 

list item을 의미하는 li라는 태그를 씌워주지 않아서 그렇다.

 

다시 해보자

 

<ul>
  <li><h1>Number one</h1></li>
  <li><h2>Number two</h2></li>
  <li><h3>Number two</h3></li>
  <li><h4>Number two</h4></li>
</ul>

 

 

 

 

앞에 귀여운 동그라미가 생겼다.

 

 

---

OL

 

UL이 unordered list 였으니까

 

OL은 ordered list이지 않을까?

 

<ol>
  <li><h1>Number one</h1></li>
  <li><h2>Number two</h2></li>
  <li><h3>Number two</h3></li>
  <li><h4>Number two</h4></li>
</ol>

 

 

이렇게 작성하고 파일을 확인해보았다

 

 

동그라미가 아닌 1,2,3,4 숫자가 생성되었다.