HTML의 기본 문법 및 의미 작성 규칙을 분석합니다.-HTML 튜토리얼-php.cn

HTML의 기본 문법 및 의미 작성 규칙을 분석합니다.

怪我咯

풀어 주다： 2017-04-30 10:47:14

원래의

1930명이 탐색했습니다.

이 글은 HTML의 기본 구문과 의미를 정리하고 예제를 제공합니다. 필요한 친구는

DOCTYPE

DOCTYPE(문서 유형)

이 선언은 문서의 시작 부분, html 태그 앞에 위치합니다. 이 태그는 문서가 어떤 HTML 또는 XHTML 사양을 사용하는지 브라우저에 알려줍니다.

DTD(Document Type Definition)

선언은

으로 시작하며 대소문자를 구분하지 않으며 앞에 다른 내용이 있으면 내용이 없습니다. (공백 제외) 웹 페이지를 렌더링하기 위해 브라우저가 IE에서 특수 모드를 켜도록 합니다. 공개 <!DOCTYPE>, 이름 형식은 등록 // 조직 // 유형 태그 // 언어, 등록은 해당 조직이 국제표준화기구(ISO)에 등록되었는지 여부를 의미하며 +는 예, -는 아니오를 의미합니다. 조직은 조직의 이름입니다(예: DTD). 유형은 일반적으로 DTD입니다. 태그는 공개 텍스트에 대한 설명, 즉 버전 번호가 뒤에 올 수 있는 참조된 공개 텍스트에 대한 고유한 설명 이름을 지정합니다. 마지막 언어는 DTD 언어의 W3C 언어 식별자입니다. 예를 들어 EN은 영어를 의미하고 ZH는 중국어를 의미합니다. XHTML 1.0은 세 가지 DTD 유형을 선언할 수 있습니다. 각각 ISO 639을 의미합니다. HTML 4.01 strict >严格版本，过渡版本，以及基于框架的HTML文档

HTML5 문서 유형

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

meta

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

에서 사용하는 문자 인코딩을 선언합니다. 문서

html5 이전

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

rreee

<!DOCTYPE html>SEO 최적화

제목

페이지 설명

키워드

웹페이지 작성자

<title>your title</title>

웹 검색 엔진 색인 방법

<meta name="description" content="your description">

팔로우 링크를 따라 대상 웹 페이지를 분석합니다. 이는 기본 동작이므로 무시할 수 있습니다.

index 웹 페이지를 색인화합니다. 이는 기본 동작이므로 무시할 수 있습니다. <meta name="keywords" content="your keywords">

noodp는 콘텐츠 설명을 작성하기 위해 오픈 디렉토리 프로젝트를 사용하지 않습니다.

noydir은 콘텐츠 설명을 작성하기 위해 Yahoo 디렉토리를 사용하지 않습니다.

<meta name="author" content="your name"> noarchive는 검색 엔진이 캐시된 콘텐츠 버전을 표시하는 것을 허용하지 않습니다.

캐시를 사용하면 검색 엔진이 콘텐츠의 캐시된 버전을 표시할 수 있습니다.

nocache는 검색 엔진이 콘텐츠의 캐시된 버전을 표시하는 것을 허용하지 않습니다. <meta name="robots" content="index,follow">

태그

는 문서의 구조를 정의하고 문서의 마크업을 보다 의미 있게 만듭니다.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
html5
<meta charset="utf-8">

로그인 후 복사

팁

html5 태그가 더 풍부하고 완벽하며 p 태그는 거의 쓸모가 없는 것 같습니다. 그러나 문서에 스타일 섹션을 추가하려는 경우에는 p 태그가 유용할 것입니다.

태그의 기본 스타일은 브라우저마다 다릅니다. 웹페이지가 다른 브라우저에서 동일한 효과를 가지려면 일반적으로 먼저 태그 스타일의 형식을 지정해야 합니다.

html5 demo
<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8">
 <title>html5 demo</title>
 </head>
 <body>
 <header>
  <h1>html5 demo</h1>
  <nav>
  <ul>
   <li>nav1</li>
   <li>nav2</li>
  </ul>
  </nav>
 </header>
 <section>
  <h1>article aside</h1>
  <article>article</article>
  <aside>aside</aside>
 <section>
 <footer>footer</footer>
 </body>
</html>

로그인 후 복사

html5를 지원하지 않는 브라우저에서 html5 태그를 사용하려면 JavaScript 코드의 작은 조각을 추가해야 합니다

@charset "utf-8";
html{margin:0;padding:0;border:0}a,abbr,acronym,address,article,aside,blockquote,body,caption,code,dd,del,dfn,dialog,p,dl,dt,em,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,iframe,img,label,legend,li,nav,object,ol,p,pre,q,section,span,table,tbody,td,tfoot,th,thead,tr,ul{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,dialog,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1.5;background:#fff}table{border-collapse:separate;border-spacing:0}caption,td,th{text-align:left;font-weight:400;float:none!important}table,td,th{vertical-align:middle}blockquote:after,blockquote:before,q:after,q:before{content:&#39;&#39;}blockquote,q{quotes:"" ""}a img{border:none}a{text-decoration:none}:focus{outline:0}

로그인 후 복사

태그 편집 가능한 속성 contenteditable

위 내용은 HTML의 기본 문법 및 의미 작성 규칙을 분석합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!