HTML ol 태그 type 속성으로 살펴보는 목차 순서와 종류 변경

<ol> 태그 type 속성

<ol> 태그 type 속성은 <li> 태그 앞에 붙는 숫자의 종류를 결정하는데 쓰이는 기능입니다. 알파벳 대문자, 소문자와 로마 숫자 대문자, 로마 숫자소문자 등으로 나눌 수 있습니다.

생략 or type=”1″

<ol> 태그의 기본 셋팅은 번호 자동 삽입입니다. 만약, 사용하는 웹사이트의 테마에 디자이너가 <ol>에 다른 모양 셋팅을 해놓았을 경우 다시 번호를 붙일 때 type="1" 을 삽입하면 됩니다.

<h2>액체 원소</h2>
  <ol type="1">
    <li>브로민 Br</li>
    <li>수은 Hg</li>
  </ol>

예제 ▷

type=”A” : 알파벳 대문자

type="A"를 삽입하면, 알파벳 대문자로 시작하는 <ol> 태그를 작성할 수 있습니다.

<h2>기체 원소 1</h2>
  <ol type="A">
    <li>수소 H</li>
    <li>헬륨 He</li>
    <li>질소 N</li>
    <li>산소 O</li>
    <li>플루오린 F</li>
  </ol>

예제 ▷

type=”a” : 알파벳 소문자

type="a"를 <ol> 태그 뒤에 삽입하면, 알파벳 소문자로 목차 붙이기가 가능합니다.

<h2>기체 원소 2</h2>
  <ol type="a">
    <li>네온 Ne</li>
    <li>염소 Cl</li>
    <li>아르곤 Ar</li>
  </ol>

예제 ▷

type=”I” : 로마숫자 대문자

로마숫자 대문자로 <ol> 태그를 시작하는 방법은 type="I" 속성의 추가입니다.

<h2>기체 원소 3</h2>
  <ol type="I">
    <li>크립톤 Kr</li>
    <li>제논 Xe</li>
    <li>라돈 Rn</li>
  </ol>

예제 ▷

type=”i” : 로마숫자 소문자

로마숫자 소문자로 시작하는 <ol> 태그는 type="i" 속성 추가로 작성할 수 있습니다.

<h2>고체 원소 1</h2>
  <ol type="i">
    <li>리튬 Li</li>
    <li>베릴륨 Be</li>
    <li>붕소 B</li>
    <li>탄소 C</li>
  </ol>

예제 ▷