웹프로그래밍 HTML (3) 리스트요소

---

📋오늘의 목표📋

HTML의 주요태그인 리스트요소에 대해서 공부해보자

리스트 요소 <ul>,<ol>,<dl>

<ul>순서가 상관없는 리스트

<ul>
	<li>콩나물</li>
    <li>파</li>
    <li>숙주나물</li>
</ul>

👉 결과 화면

• 콩나물
• 파
• 숙주나물

<ol>순서가 있는 리스트

<h5>종이접기</h5>
<ol>
	<li>종이를 네모로 반 접는다.</li>
    <li>종이를 다시 반 접는다. </li>
    <li>그러면 완성~</li>
</ol>

👉결과 화면

1. 종이를 네모로 반 접는다.
2. 종이를 다시 반 접는다.
3. 그러면 완성~

<dl>순서가 있는 리스트

<dt> : 용어
<dd> : 용어 설명

<dl>
    <dt>진서현</dt>
    <dd>나(●'◡'●)</dd>
    <dt>진서경</dt>
    <dd>우리언니(^///^)</dd>
    <dt>진서아</dt>
    <dd>우리집 막냉^_~</dd>
</dl>

👉 결과화면

진서현 나(●'◡'●) 진서경 우리언니(^///^) 진서아 우리집 막냉^_~

리스트의 중첩

리스트는 중첩이 가능하다.
▶️<ol>태그의 자식은 <li>태그만 가능하다.
▶️<li>태그는 다양한 자식을 가질 수 있다.

<h3>월드컵 조 편성</h3>
<ol>
	<li>
    	1조
        <ul>
        	<li>러시아</li>
            <li>우루과이</li>
        </ul>
    </li>
    <li>
    	2조
        <ul>
        	<li>한국</li>
            <li>일본</li>
        </ul>
    </li>
</ol>

👉 결과화면

월드컵 조 편성

1. 1조
   • 러시아
   • 우루과이
2. 2조
   • 한국
   • 일본

---

🏅오늘 느낀 점🏅

<velog쓰는거 어렵다. 아마 더 배우면 텍스트관련 요소들이 나올텐데
그걸로 글자 크기도 조절하고 싶다.