front_basic/1.intro.html at main · luail/front_basic · GitHub

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
<!-- 해당 파일이 HTML5(버전)임을 명시 -->
<!DOCTYPE html>
<html>
    <!-- head는 html문서의 각종 설정정보(메타데이터) 정의. -->
    <head>
        <meta charset="UTF-8">
        <!-- 1.즐겨찾기 또는 북마크로 활용 2. 검색엔진에서 중요한 키워드로 사용 -->
        <title>나의 첫 html 문서</title>
    </head>

    <!-- body는 html 내용의 본운 -->
    <body>
        <h1>HTML 학습하기</h1>
        <h2>H태그는 제목을 의미하고 위아래로 약간의 여백이 자동삽입되고 줄바꿈.</h2>
        <h3>검색엔진에서 h태그는 중요한 검색 키워드로 사용</h3>
        <p>p태그는 단락구분 태그이고, 줄바꿈이 되면서 태그 위아래로 약간의 여백이 삽입</p>
        <p>
            html 태그 내에서는 엔터를 치더라도 줄바꿈이 되지 않고, <br>
            &lt;br&gt;태그를 써야 줄바꿈이 됨에 유의. 또한 웹브라우저에서는       여러번 띄어쓰기를 하더라도 한번만 띄어쓰기가 됨에 유의.

        </p>

        <h2>텍스트의 형식</h2>
        <p>
            <b>굵게</b>와 <strong>강조된 굵게</strong>가 사용되고, <i>이텔릭체</i>와 <em>강조된 이텔릭체</em>가 있다.
            <del>삭제된 텍스트</del>를 표현할때 del태그 사용
            <b><i><del><br>여러개도 같이 사용된당</del></i></b>
        </p>

        <h2>html에서 엔티티(특수기호) 사용</h2>
        <p>단락을 표시하는 태그. &lt;p&gt; 태그이다.</p>
        <p>여러개의 공백을 넣고 싶을 때에는 &nbsp;&nbsp;&nbsp;&nbsp; nbsp를 사용한다.</p>

        <div>div태그는 줄바꿈되는 단락처럼 사용되나, 별다른 기능이 없고 다른 HTML요소들을 하나로 묶어 디자인을 적용하는데 주로 사용.</div>
        <span>span 태그는 별다른 기능이 없고, html요소들에 css 적용을 위해 주로 사용. 줄바꿈이 없다.</span>
    </body>
</html>