반응형
<ol> 태그는 ordered list 의 약자로 순서가 있는 목록 이라는 뜻 입니다.
HTML 에서 하기와 같은 순서가 있는 목차를 만들고 싶다면 ol 태그를 사용하면 됩니다.
그럼, 실제 예제를 살펴보겠습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- Ordered list -->
<ol>
<li>나이키</li>
<li>아디다스</li>
<li>푸마</li>
<li>프로스펙스</li>
</ol>
</body>
</html>
내용 부분인 <body> 안에 <ol>태그를 명시해줍니다.
<ol>태그를 만나는 순간 브라우저는 아~순서있는 리스트가 나오겠구나 하고 알게되는 것 입니다.
<ol>태그 하부에는 각 리스트 별로 <li> 태그 (list 의 약자) 를 배치시킵니다.
순서대로 1 부터 숫자가 붙여지기에 원하는 목차만큼 기재하면 됩니다.
순서가 있는 목록 리스트를 만들기 위해서는 하기 기본 구조를 머리 속에 생각하면 좋겠습니다.
<!-- Odered list -->
<ol>
<li>나이키</li>
<li>아디다스</li>
<li>푸마</li>
<li>프로스펙스</li>
</ol>
<ol>태그 사용법 이였습니다. 감사합니다.
반응형
'앱 만들기 > HTML5 study' 카테고리의 다른 글
<ul>태그 예제 (2) | 2023.02.26 |
---|---|
<ol> 태그 속성 (2) | 2023.02.19 |
<hr> 태그 예제 (2) | 2023.02.04 |
<strong>태그 사용법 (1) | 2023.01.28 |
<em> 태그 사용법 (2) | 2023.01.26 |
댓글