[HTML & CSS] <ol> <ul> <li> 태그 - List 만들기

[HTML & CSS]  <ol> <ul> <li> 태그 - List 만들기

 

먼저 뜻을 알고 가자

 

ol : Ordered List

=> 순서가 있을 때 사용하는 것으로 외우면 쉽다

 

ul : Unordered List 

=> 순서가 없을 때 사용하는 것으로 외우면 쉽다

 

<ul></ul> 태그로 <li></li> 태그를 감싸주면 목록같은 리스트가 만들어진다

리스트 앞에는 불릿기호가 붙는다

 

<ul>
	<li>안녕하세요1</li>
	<li>안녕하세요2</li>
	<li>안녕하세요3</li>
</ul>

 

 

<ol></ol> 태그로 <li></li> 태그들을 감싸주면 순서가 있는 리스트가 만들어진다

리스트 앞에는 숫자가 붙는다

 

<ol>
	<li>안녕하세요1</li>
	<li>안녕하세요2</li>
	<li>안녕하세요3</li>
</ol>

 

<ul> 태그 안에  <ol> 태그를 사용할 수 있고

<ol> 태그 안에 <ul> 태그를 사용할 수 있다

<ul>
	<li>안녕하세요1</li>
	<li>안녕하세요2</li>
	<li>안녕하세요3</li>
	<ol>
		<li>안녕하세요1</li>
		<li>안녕하세요2</li>
		<li>안녕하세요3</li>
	</ol>
</ul>

<ol>
	<li>안녕하세요1</li>
	<li>안녕하세요2</li>
	<li>안녕하세요3</li>
	<ul>
		<li>안녕하세요1</li>
		<li>안녕하세요2</li>
		<li>안녕하세요3</li>
	</ul>
</ol>