[html] 기본 문서 구조

728x90

html/css 를 사용하기 전에 문서 제일 상단에

<!DOCTYPE html>

<meta>

<link>

<title></title> 등을 입력하여

현재 문서 타입이 무엇인지 어떤 문자를 쓰는지,

수집을 허용할것인지, 홈페이지 타이틀은 무엇인지,

간단한 소개 등 을 입력하여 다양한 브라우저들에서

마크업에 대한 일괄된 화면 표시가 될 수 있도록 도와준다.

아래 colorScripter에 어떤식으로 작성하는지 입력하고, 그옆에 주석처리하여 설명을 달아놨다.

태그는 검색에 대한 명령인데

index,follow는 수집을 허용하는 기본값(all)이고,

허용하지 않을때에는

중간쯤에 있는 title태그는

<title>on sunday :: on sunday</title>

말 그대로 페이지의 타이틀이 되는 내용을 적으면 된다.

하단이미지에 빨간 밑줄친 곳에 출력되는게 title태그이다.

title 앞에 보이는 이미지는favicon이라고 하는데

##부분에 이미지주소를 넣으면 된다.

<!DOCTYPE html><!-- HTML5 선언문  <html></html> --> 
<html lang="ko"><!-- ko 한국 // en 외국 // cn 중국 // jp일본  -->
<head>
<!--  호환성 보기제거 메타 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
 
<!--미디어쿼리-->
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
 
<!-- 기본 문자 설정 - utf-8 다국어  -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8 ">
 
<!-- robots 검색,수집하는 프로그램 -->
<meta name="robots" content="index,follow">
 
<!-- 캐쉬 사용하지 않음 메타 -->
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="Expires" content="0"/>
<meta http-equiv="Pragma" content="no-cache"/>
 
<meta name="Description" content="일상생활 기록용 블로그입니다. 여행 맛집 및 공부 기록하기 위해 제작되었습니다.">
<meta name="Author" content="제작자 : carina16">
<meta name="Keywords" content="html,css,javascript,일상,여행,맛집">
 
<!-- 페이스북 관련 메타 -->
<meta property="og:image" content=""/>
<meta property="og:title" content="[Gn글로벌]"/>
<meta property="og:description" content=""/>
<meta property="og:type" content="website" />
 
<!-- 트위터 관련 메타 -->
<meta name="twitter:title" content="[Gn글로벌] ">
<meta name="twitter:image"    content="">
<meta name="twitter:description" content="">
 
<!-- 네이버 사이트 등록 관련 메타 -->
<meta name="naver-site-verification" content=""/>
<meta name="description" content="설명 문구">
<meta property="og:type" content="website">
<meta property="og:title" content="carina16">
<meta property="og:description" content="설명 문구">
<meta property="og:image" content="https://carina16.tistory.com/images/hellow.jpg">
<meta property="og:url" content="https://carina16.tistory.com/">
 
 
<link rel="shortcut icon" href="https://ssl.pstatic.net/sstatic/search/favicon/favicon_140327.ico"> 
<title>[홈페이지 타이틀 : carina16]</title>
 
----------------------------------<!--CSS 추가-->----------------------------------
<link rel="stylesheet" href="/css/common.css" type="text/css">  
 
----------------------------------<!--스트립트-->----------------------------------
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>
 
</head>
 
<body>
 
</body>
 
<style>
 
</style>
 
</html>
Colored by Color Scripter
cs

728x90

저작자표시 비영리 변경금지

'IT > html + css' 카테고리의 다른 글

[html] form 요소 (0)	2019.12.27
[html] 표 만드는 table태그 (0)	2019.12.19
[html] a 링크, a 태그 만들기 - 새창으로 이동 속성 (0)	2019.12.18
[html] 인라인요소 태그 (0)	2019.12.17
[html] 블록 요소, 인라인요소, 인라인블록 (0)	2019.12.16