HTMLの概要


HTMLとは?


HTMLは簡単に「Webドキュメントを作成する言語」と略すことができます.
  • HTMLはハイパーテキストタグ言語の略です.
  • では、Hyper Textはドキュメントへのリンクです.
    タグは表示を表し、Webブラウザに表示されるコンテンツのテキスト、画像、ビデオなどの位置を表す.
  • 우리가 자주 사용하는 엑셀이나 워드 파일과 같은 일반 문서는 내용을 입력하는 프로그램과 입력한 내용을 확인하는 프로그램이 같다.
    ex) 워드 파일로 표를 만든다면 워드 프로그램에서 제공하는 기능을 사용해서 표를 입력하고,
        이 파일을 워드 프로그램에서 불러와서 만들었던 표를 그대로 사용할 수 있다.
    
    but 웹 문서는 내용을 작성하는 프로그램과 그 내용을 확인하는 프로그램이 다르다.
        웹 편집기에서 마크업 형식으로 표를 작성하여야 한다.
    ->Webブラウザは、ラベルと呼ばれるタイトル、テキスト、テーブルを区別するためにラベルを貼る必要があります.

    2.HTML構造


    HTMLドキュメントには、所定の形式でコンテンツを入力する必要があります.


    ① < !DOCTYPE html>:現在のドキュメントがHTML 5言語で作成されたWebドキュメントであることを示します.
    ②< html>~:Webドキュメントの開始と終了を示すタグで、ブラウザがタグに遭遇すると、ソースがに読み込まれて画面に表示されます.
    ③< head>~:Webブラウザは、Webドキュメントの解釈に必要な情報を入力します.
    ④< body>~:実際にはウェブブラウザの画面上の内容であり、HTMLのタグの大部分はタグの中にある.

    3.HTMLドキュメントで使用される4種類のタグ


    1) < !DOCTYPE html>:ドキュメントタイプのタグを指定
    ->現在のドキュメントがHTML 5ドキュメントであることをWebブラウザで確認します.
    2):HTMLファイルの開始と終了を示すタグ**
    タグはWebドキュメントの開始を表し、タグはWebドキュメントの終了を表す.
    からタグの間にWebドキュメントソースを作成すればよい.
    3):Webブラウザでドキュメント情報を提供するタグ
    <meta> : 문자 세트를 비롯하여 문서 정보가 들어 있는 태그
             웹 문서와 관련된 정보를 지정할 때 사용한다.
    <meta charset = "UTF-8"> : 웹 서버는 영어가 기본이므로 화면에 한글로 된 내용을 표시할 때 "UTF-8" 문자 세트를 사용
    <meta name = "keywords" content = " "> : 웹 문서의 키워드
    <meta name = "description" content = " "> : 웹 문서의 설명
    <meta name = "author" content = " "> : 웹 문서의 제작자
    <tittle> : 웹 문서의 제목
    <tittle> 제목 </tittle>
    4):Webブラウザにコンテンツのタグを表示する
    <body>
    	<h1> 웹 개발 </h1>
        <p> HTML </p>
        <p> CSS </p>
        <p> JavaScript </p>
    </body>

    4.VSコードを使用してHTMLのデフォルト構造を作成する



    TIP
    첫 번째 줄에 '!'를 입력한 후 Tab 키를 눌러 HTML 소스 코드 자동으로 입력하기
    사용하려는 태그 (h1, p 등) 입력 후 Tab 키를 눌러 코드 자동으로 입력하기
    코드 작성 후 F5을 누르면 웹 사이트가 실행된다!