HTML + CSS

ol , ul 테스트

H_u 2024. 4. 12. 14:47
728x90
반응형
SMALL

ol 을 이용한 실습

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <ol></ol>:들여쓰기 -->
    <!-- <ol></ol>+li 순서 있는 목록: 기본은 숫자 1.2. -->
    <!--type 속성으로 순서 타입을 정함 -->
    <h1>1박 2일 가족 여행 코드</h1>
    <ul>
       <li>1일차</li>
       <li>해녀박물관</li>
       <li>낚시체험</li>
    </ol>
    <li>2일차</li>
    <!-- start 속성으로 시작 순서를 정함 -->
    <!-- <ol type="a" start="3" -->
        <!--type="I"로마숫자 대문자  -->
        <!--ol type="I">  -->
        <!-- type="i"로마숫자 소문자 -->
    <ol type="a" staet="3">
    <ol type="i">
    <li> 용눈이오름</li>
    <li> 만장굴</li>    
    <li> 카약체험</li>
       
       
    </ul>
</body>
</html>

 

ul 을 이용한 실

 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <
    <h1>관광 안내 전화</h1>
    <ul>
    <li>일반 전화:(국번없이)1330</li>
    <li>휴대전화:010-1111-2222</li>
    </ul>
</body>
</html>
728x90
반응형
SMALL