HTML,CSS, JS/HTML&CSS 스터디

[HTML&CSS 스터디] 11. 리스트 출력하기 <ul>,<li>

Song hyun 2024. 7. 7. 17:14
728x90
반응형

[HTML&CSS 스터디] 11. 리스트 출력하기 <ul>,<li>

 

1. 리스트를 출력하는 <ul> 태그

-ul은 Unordered List의 약자로, 순서없는 리스트를 의미한다.

-하지만 <ul>태그는 이 자체로만 작동하지는 않는다. 리스트를 출력하기 위해서는 <li> 태그 역시 필요하다.

 

2. 순서 있는 리스트를 출력하는 <ol>+<li> 태그

-ol은 Orderd List의 약자로, 정렬된 리스트라는 의미를 지닌다.

-<ul> 태그와 마찬가지로 <li>태그를 내부에 넣어야 작동한다.

첫번째가 ul+li, 두번째가 ol+li

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="UTF-8">
    <title>고양이의 일상</title>
    <meta name="description" content="고양이가 좋아하는 것과 일상을 소개합니다.">
  </head>
  <body>
    <ul>
      <li>오늘 뭐 먹지?</li>
      <li>1. 짜장면</li>
      <li>2. 짬뽕</li>
    </ul>

    <ol>
      <li>오늘 뭐 먹지?</li>
      <li>1. 스파게티</li>
      <li>2. 리조또</li>
    </ol>
  </body>
</html>
728x90
반응형