HTML+CSS

HTML+CSS+자바스크립트 웹코딩의 정석 2강.

Hvvvi 2021. 3. 29. 19:50
728x90

4. 웹 문서에 다양한 내용 입력하기

4.1 텍스트 입력하기

제목

  • heading
  • ~~
  • 점점 작아짐
  • 반드시 사용

단락

줄바꿈

'인용

강조(굵게)

굵게

강조(기울이기)

기울이기

줄임말

참고사항

컴퓨터인식

작은 텍스트(부가정보 등)

아래 첨자

위 첨자

취소선

밑줄

새 내용 삽인

삭제

**
4.2 목록 만들기**

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>목록만들기</title>
</head>
<style>
 
 
</style>
<body>
    <h1>unordered List</h1>
    <hr>
    <ul>
    <li>HTML5</li> 
    <li> CSS3</li> 
    <li> JSCIPT</li> 
    <li> JQUERY</li>
    </ul>
    <h1>ordered List</h1>
    <ol>
    <li> HTML5</li> 
    <li> CSS3</li> 
    <li> JSCIPT</li> 
    <li> JQUERY</li>
    </ol>
    
    <ol type="A" start="C">
    <li> HTML5</li> 
    <li> CSS3</li> 
    <li> JSCIPT</li> 
    <li> JQUERY</li>
    </ol>
    
    <dl>
    <dt> HTML5</dt> 
    <dd> 구조적문서</dd> 
    <dt> CSS3</dt> 
    <dd> 디자인</dd> 
    <dt> JSCIPT</dt> 
    <dd> 동작</dd> 
    <dt> JQUERY</dt>
    </dl> 
    
    
</body>
</html>
cs
      -
    1. : 순서가 있는 목록

--> _ 1(숫자), a(영소문자), A(영대문자), i(로마소문자), I(로마대문자)

      • -
      • : 순서가 없는 목록
        -
        : 설명 목록

        4.2 표 만들기

        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
        34
        35
        36
        37
        38
        39
        40
        41
        42
        43
        44
        45
        46
        47
        48
        49
        50
        51
        <!DOCTYPE html>
        <html>
        <head>
        <meta charset="UTF-8">
        <title>Insert title here</title>
        <style>
        table, td {
            boder-collapse: collapse;
        }
        </style>
        </head>
        <body>
            <h1>우리반 목록</h1>
            <table border="1">
                <thead>
                <tr>
                    <th>이름</th>
                    <th>전화번호</th>
                    <th>전공</th>
                </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>이름1</td>
                        <td>0101</td>
                        <td>ㅁㅁㅁ</td>
                    </tr>
                    <tr>
                        <td>이름1</td>
                        <td>0101</td>
                        <td>ㅁㅁㅁ</td>
                    </tr>
                    <tr>
                        <td>이름1</td>
                        <td>0101</td>
                        <td>ㅁㅁㅁ</td>
                    </tr>
                    <tr>
                        <td colspan="2">aa</td>
                        <td rowspan="2">ㅁㅁㅁ</td>
                    </tr>
                    <tr>
                        <td colspan="2">aa</td>
                    </tr>
         
                </tbody>
            </table>
        <iframe src="https://naver.com">
         
        </body>
        </html>
        cs
728x90