HTML 헤더 요소

더 많은 예제

문서 제목
<title> 태그는 문서의 제목을 정의합니다.
모든 링크의 목표
base 태그를 사용하여 페이지 내 모든 링크가 새 창에서 열리도록 설정하는 방법
문서 설명
문서를 설명하기 위해 <meta> 요소를 사용합니다.
문서 키워드
문서의 주요 키워드를 정의하기 위해 <meta> 요소를 사용합니다.
사용자 리디렉션
사용자를 새로운 URL로 리디렉션하는 방법

HTML <head> 요소

<head> 요소는 모든 헤더 요소의 컨테이너입니다.<head> 내 요소는 스크립트를 포함할 수 있으며, 브라우저가 스타일 시트를 어디에서 찾을 수 있는지 지시하거나 메타 정보를 제공하는 등 다양한 기능을 수행할 수 있습니다.

以下标签都可以添加到 head 部分：、<base>、<link>、<meta>、<script> 以及 <style>。</p> </div> <div> <h2>다음 태그는 head 부분에 추가할 수 있습니다：<title>、<base>、<link>、<meta>、<script> 및 <style>.</h2> <p>HTML <title> 요소</p> <p><title> 태그는 문서의 제목을 정의합니다.</p> <p>title 요소는 모든 HTML/XHTML 문서에서 필수적입니다.</p> <ul> <li>title 요소는 다음을 할 수 있습니다:</li> <li>브라우저 도구 표시줄에 표시되는 제목 정의</li> <li>صفحه‌ای که به علامت‌داشته‌ها اضافه می‌شود، نمایش داده‌شده‌است</li> </ul> <p>검색 엔진 결과에 표시되는 페이지 제목</p> <pre class="language-html"> <!DOCTYPE html> <html> <head> <title>문서의 제목</title> </head> <body> 문서의 내용...... </body> </html> </pre> </div> <div> <h2>HTML <base> 요소</h2> <p><base> 태그는 페이지에 모든 링크에 대해 기본 주소나 기본 목표(target)를 정의합니다:</p> <pre class="language-html"> <head> <base href="http://www.codew3c.com/images/" /> <base target="_blank" /> </head> </pre> </div> <div> <h2>HTML <link> 요소</h2> <p><link> 태그는 문서와 외부 자원 간의 관계를 정의합니다.</p> <p><link> 태그는 가장 많이 사용되는 스타일 시트 연결입니다:</p> <pre class="language-html"> <head> <link rel="stylesheet" type="text/css" href="mystyle.css" /> </head> </pre> </div> <div> <h2>HTML <style> 요소</h2> <p><style> 태그는 HTML 문서에 스타일 정보를 정의하는 데 사용됩니다.</p> <p>style 요소 내에서 HTML 요소가 브라우저에서 어떻게 표시될지 정의할 수 있습니다:</p> <pre class="language-html"> <head> <style type="text/css"> body {background-color:yellow} p {color:blue} </style> </head> </pre> </div> <div> <h2>HTML <meta> 요소</h2> <p>메타데이터(metadata)는 데이터에 대한 정보입니다.</p> <p><meta> 태그는 HTML 문서에 대한 메타데이터를 제공합니다. 메타데이터는 페이지에 표시되지 않지만 기계가 읽을 수 있습니다.</p> <p>표준적인 경우, meta 요소는 페이지 설명, 키워드, 문서 작성자, 마지막 수정 시간 등 다른 메타데이터를 정의하는 데 사용됩니다.</p> <p><meta> 태그는 항상 head 요소 내에 위치합니다.</p> <p>메타데이터는 브라우저(콘텐츠 표시 방법 또는 페이지 다시 로드), 검색 엔진(키워드), 또는 다른 웹 서비스에 사용될 수 있습니다.</p> <h3>검색 엔진을 위한 키워드</h3> <p>일부 검색 엔진은 meta 요소의 name과 content 속성을 사용하여 페이지를 인덱싱합니다。</p> <p>아래 meta 요소는 페이지의 설명을 정의합니다：</p> <pre class="language-html"> <meta name="description" content="Free Web tutorials on HTML, CSS, XML" /> </pre> <p>아래 meta 요소는 페이지의 키워드를 정의합니다：</p> <pre class="language-html"> <meta name="keywords" content="HTML, CSS, XML" /> </pre> <p>name과 content 속성의 역할은 페이지의 내용을 설명하는 것입니다。</p> </div> <div> <h2>HTML <script> 요소</h2> <p><script> 태그는 클라이언트 스크립트를 정의하는 데 사용됩니다. 예를 들어, JavaScript.</p> <p>script 요소에 대해 나중章节에서 설명하겠습니다.</p> </div> <div> <h2>HTML 헤더 요소</h2> <table class="dataintable"> <tr> <th style="width:30%;">태그</th> <th style="width:70%;">설명</th> </tr> <tr> <td><a href="/ko/tags/tag_head.html" title="HTML <head> 태그"><head></a></td> <td>문서에 대한 정보를 정의합니다。</td> </tr> <tr> <td><a href="/ko/tags/tag_title.html" title="HTML <title> 태그"><title></a></td> <td>문서 제목을 정의합니다。</td> </tr> <tr> <td><a href="/ko/tags/tag_base.html" title="HTML <base> 태그"><base></a></td> <td>페이지 상에 모든 링크의 기본 주소나 기본 목표를 정의합니다。</td> </tr> <tr> <td><a href="/ko/tags/tag_link.html" title="HTML <link> 태그"><link></a></td> <td>문서와 외부 자원 간의 관계를 정의합니다。</td> </tr> <tr> <td><a href="/ko/tags/tag_meta.html" title="HTML <meta> 태그"><meta></a></td> <td>HTML 문서에 대한 메타 데이터를 정의합니다。</td> </tr> <tr> <td><a href="/ko/tags/tag_script.html" title="HTML <script> 태그"><script></a></td> <td>클라이언트 스크립트를 정의합니다。</td> </tr> <tr> <td><a href="/ko/tags/tag_style.html" title="HTML <style> 태그"><style></a></td> <td>문서의 스타일 정보를 정의합니다。</td> </tr> </table> </div> <div class="prenextnav"> <ul> <li> 이전 페이지 <a href="/ko/html/html_filepaths.html" title="HTML 파일 경로">HTML 경로</a></li> <li> 다음 페이지 <a href="/ko/html/html_layout.html" title="HTML 레이아웃">HTML 레이아웃</a></li> </ul> </div><div style="background-color:#fcfdf8; padding:0;"> </div> </div> <!-- maincontent end --> <div id="sidebar"> <div><h3><center> 도구함 </center><h3> <h5 id="tools_reference"><a href="/ko/tags/index.html">HTML 참조 매뉴얼</a></h5> <h5 id="tools_example"><a href="/ko/html/html_examples.html">HTML 예제</a></h5> <h5 id="tools_quiz"><a href="/ko/html/html_quiz.html">HTML 테스트</a></h5> </div> <div><h3><center> 스폰서 링크 </center><h3> <div id="sbtg"> <script src="/myjs/zzsr.js"></script> </div> </div> </div> <div id="footer"> <p id="p1"> CodeW3C.com에서 제공하는 내용은 교육 및 테스트 용으로 제공되며, 내용의 정확성을 보장하지 않습니다. 이 사이트의 내용을 사용함으로 인해 발생하는 모든 위험은 이 사이트와 무관합니다. 저작권 소유, 모든 권리를 보존합니다. </p> <p id="p2"> <a href="/ko/about/index.html" title="CodeW3C.com에 관하여">CodeW3C.com에 관하여</a> <a href="/ko/about/about_helping.html" title="CodeW3C.com에 대한 도움말">CodeW3C.com에 대한 도움말</a> <a href="/ko/about/about_use.html" title="사용에 관하여">이용약관</a> <a href="/ko/about/about_privacy.html" title="개인정보에 관하여">개인정보 이용약관</a> <a href="http://www.comfortsoftwaregroup.com/" target="_blank"><img src="/comfortsoftwaregroup.png"></a> <a href="http://www.ce4e.com/" target="_blank"><img src="/poweredby.png" alt="Ce4e.com으로 구동됨"></a> </p> </div> </div> <!-- wrapper end --> <script src="/myjs/tongji.js"></script> </body> </html>