Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML에서 순서 있는 목록(Ordered List) 만드는 방법 완벽 가이드

HTML에서 순서가 있는 목록을 만들려면 <ol> 태그를 사용합니다. 순서 있는 목록은 <ol> 태그로 시작하며, 각 항목은 <li> 태그로 작성합니다. 목록 항목 앞에는 숫자, 알파벳, 로마 숫자 등이 자동으로 붙는데, 기본값은 아라비아 숫자(1, 2, 3...)입니다.

순서 있는 목록의 기본 구조

순서 있는 목록의 기본적인 HTML 구조는 다음과 같습니다.

<ol>
   <li>첫 번째 항목</li>
   <li>두 번째 항목</li>
   <li>세 번째 항목</li>
</ol>

예제

아래 코드를 실행하면 HTML에서 순서 있는 목록이 어떻게 표시되는지 직접 확인할 수 있습니다.

<!DOCTYPE html>
<html>
   <body>
      <h1>Developed Countries</h1>
      <p>The list of developed countries :</p>
      <ol>
         <li>US</li>
         <li>Australia</li>
         <li>New Zealand</li>
      </ol>
   </body>
</html>

다양한 번호 스타일 적용하기

type 속성을 사용하면 목록에 표시되는 기호의 종류를 변경할 수 있습니다.

  • type="1" — 숫자 (1, 2, 3...) : 기본값
  • type="A" — 대문자 알파벳 (A, B, C...)
  • type="a" — 소문자 알파벳 (a, b, c...)
  • type="I" — 대문자 로마 숫자 (I, II, III...)
  • type="i" — 소문자 로마 숫자 (i, ii, iii...)

또한 start 속성을 사용하면 목록이 시작되는 번호를 지정할 수 있고, reversed 속성을 추가하면 역순으로 번호를 매길 수도 있습니다.