🌍 HTML\CSS

List (λͺ©λ‘) - ul , ol ν™œμš©λ²•

Meteora_ 2021. 2. 24. 15:54
728x90

un - > μˆœμ„œμ—†λŠ” λͺ©λ‘

 

ol  - > μˆœμ„œμžˆλŠ” λͺ©λ‘(숫자)

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<!-- 

	list : λͺ©λ‘
	
	1.
	2.
	3.
	
<ul></ul> unordered list (μˆœμ„œμ—†λŠ” λͺ©λ‘)

 -->
 
 <ul>
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ul>
 
 <ul style="list-style-type : disc;">  <!-- 아무것도 μ•ˆλ„£μ—ˆμ„λ•Œ -->
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ul>
 
 <ul style="list-style-type : circle;">
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ul>
 
 <ul style="list-style-type : none;">
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ul>
 
 <!-- <ol></ol> ordered list μˆœμ„œ(숫자)μžˆλŠ” 리슀트 -->
 <ol> 
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ol>
 
 <ol type="1"> <!-- κΈ°λ³Έν˜• -->
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ol>
 
 <ol start="3"> <!-- μ‹œμž‘λ²ˆν˜Έ μ„€μ • -->
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ol>
 
 <ol type="A"> <!-- μ•ŒνŒŒλ²³ μ‹œμž‘ --> 
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ol>
 
 <ol type="i"> <!-- 둜마자 μ‹œμž‘ --> 
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ol>
 
 <ol type="κ°€"> <!-- ν•œκΈ€μ€ μ•ˆλ¨ --> 
 <li>coffee</li>
 <li>tea</li>
 <li>milk</li>
 </ol>
 
 
 <!-- λ¦¬μŠ€νŠΈμ•ˆμ— λ¦¬μŠ€νŠΈλ„£κΈ° -->
 
 <ul>
 <li>coffee
 	<ol>
 	<li>black</li>
 	<li>milk</li>
 	</ol>
 </li>
 <li>tea</li>
 <li>milk</li>
 </ul>
 


</body>
</html>

 

κ²°κ³Ό -> 

 

 

 

 

μ €μž‘μžν‘œμ‹œ (μƒˆμ°½μ—΄λ¦Ό)