1. HTML 리스트 종류

 

- 순서가 있는 리스트(ordered list) : <ol></ol>

- 순서가 없는 리스트(unordered list) : <ul></ul>

- 정의 리스트(definition list) : <dl></dl>

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>리스트</title>
</head>
<body>
    <h3>리스트 만들기</h3>
    <hr>
    <h3>라면 끓이는 순서</h3>
    <ol type="A">
        <li>물을 끓인다.</li>
        <li>라면과 스프를 넣는다.</li>
        <li>파를 썰어 넣는다.</li>
        <li>5분 후 먹는다.</li>
    </ol>
 
    <ol type="1">
        <li>물을 끓인다.</li>
        <li>라면과 스프를 넣는다.</li>
        <li>파를 썰어 넣는다.</li>
        <li>5분 후 먹는다.</li>
    </ol>
 
    <ul type="circle">
        <li>물을 끓인다.</li>
        <li>라면과 스프를 넣는다.</li>
        <li>파를 썰어 넣는다.</li>
        <li>5분 후 먹는다.</li>
    </ul>
</body>
</html>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter
http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white">cs

2. <ul>, <li>

순서가 없는 목록을 만드는 리스트 태그문

목록의 시작은 <ul>로, 안에 리스트들은 <li>로 시작한다.

</li>는 생략 가능하다.

 

list style type

- disc : ● 기본값 

- circle : ○ 가운데가 비어있는 원

- square : ■ 사각형 

- none : 없다.

 

3. <ol>, <li>

 

순서가 있는 목록을 만드는 태그문

숫자를 대신해 각종 기호, 순번기호를 넣는다.

타입만 작성해주면 된다.

 

type

type="1" : 순번표현(기본값)

type="A" : A,B,C 대문자 순번 

type="a" : a,b,c 소문자 순번 

type="I" :  I, II, III, 대문자 로마 숫자 

type="i" : i,ii,iii 소문자로마숫자

 

 

위 코딩 결과 값

'화면구현' 카테고리의 다른 글

HTML 하이퍼링크  (0) 2020.03.03
HTML 테이블 만들기  (0) 2020.03.03
HTML 이미지 삽입  (0) 2020.03.03
링크태그와 메타 데이터 삽입  (0) 2020.03.03
HTML 태그(4)  (0) 2020.03.02
openclose