HTML의 기본 구문과 의미론적 사용 규칙에 대한 설명
- 巴扎黑원래의
- 2017-08-11 13:50:531393검색
이 글은 HTML의 기본 구문과 의미를 정리하고 예제를 제공합니다. 필요한 친구들은 참고해도 됩니다.
DOCTYPE
DOCTYPE(Document Type)
이 문장은 문서 맨 앞부분에 있습니다. html 태그입니다. 이 태그는 문서가 사용하는 HTML 또는 XHTML 사양을 브라우저에 알려줍니다.
DTD (문서 유형 정의)
선언은 1a309583e26acea4f04ca31122d8c535로 시작하며 대소문자를 구분하지 않으며 앞에 다른 내용(. 공백 제외) 브라우저는 IE에서 특수 모드를 켜 웹 페이지를 렌더링합니다. 공개 DTD, 이름 형식은 등록 // 조직 // 유형 태그 // 언어, 등록은 해당 조직이 국제 표준화 기구(ISO)에 등록되었는지 여부를 나타내며 +는 예, -는 아니요. 조직은 조직의 이름입니다(예: W3C). 유형은 일반적으로 DTD입니다. 태그는 지정된 공개 텍스트 설명입니다. 즉, 참조된 공개 텍스트에 대한 고유한 설명 이름이며 뒤에 버전 번호가 올 수 있습니다. 마지막 언어는 DTD 언어의 ISO 639 언어 식별자입니다. 예를 들어 EN은 영어를 의미하고 ZH는 중국어를 의미합니다. XHTML 1.0은 세 가지 DTD 유형을 선언할 수 있습니다. 엄격한 버전, 전환 버전, 프레임워크 기반 HTML 문서를 각각 나타냅니다. 1a309583e26acea4f04ca31122d8c535开始，不区分大小写，前面没有任何内容，如果有其他内容(空格除外)会使浏览器在IE下开启怪异模式(quirks mode)渲染网页。公共DTD，名称格式为注册//组织//类型 标签//语言,注册指组织是否由国际标准化组织(ISO)注册，+表示是，-表示不是。组织即组织名称，如：W3C。类型一般是 DTD。标签是指定公开文本描述，即对所引用的公开文本的唯一描述性名称，后面可附带版本号。最后语言是DTD语言的ISO 639语言标识符，如：EN表示英文，ZH表示中文。XHTML 1.0 可声明三种DTD 类型。分别表示严格版本，过渡版本，以及基于框架的HTML文档。
HTML 4.01 strict
ab540a5be9b0ab2c90344bc442e25cc5
HTML 4.01 Transitional
c22098bfd3f62d7436149aaab013de1a
HTML 4.01 Frameset
d44b1c13b51eddec01ecbde9e66f5216
HTML5文档类型
8b05045a5be5764f313ed5b9168a17e682e535b3f4e9f6fb9559d510cf4cacf8
meta
声明文档使用的字符编码
html5之前
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> html5 <meta charset="utf-8">
SEO优化
标题
b2386ffb911b14667cb8f0f91ea547a7your title6e916e0f7d1e588d4f442bf645aedb2f
页面描述
7feda0267ff3699a427bb596e1b0e236
关键字
4c3a886eab3d67fdfa884844224a10d6
网页作者
5007405b6a1cdbbad2c35b001185ac9f
网页搜索引擎索引方式
ea5e18c779cec93c332f3f68c5f195a4
follow 跟踪链接并分析目标网页。这是默认行为，并且可忽略。
index 将网页编入索引。这是默认行为，并且可忽略。
noodp 不使用 Open Directory Project 来创建内容描述。
noydir 不使用 Yahoo Directory 来创建内容描述。
noarchive 不允许搜索引擎显示内容的缓存版本。
cache 允许搜索引擎显示内容的缓存版本。
nocache 不允许搜索引擎显示内容的缓存版本。
标签
定义文档的结构，使文档的标记更加语义化。
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>
tips
html5标签更加丰富和完善，p标签似乎没有什么用武之地，但是如果仅仅想在文档中加入一段样式，这个时候p标签便派上用场了。
标签在不同浏览器默认样式会有一些区别，为了一个网页在不同浏览器中看到的效果一样，通常要先格式化一下标签的样式
@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:''}blockquote,q{quotes:"" ""}a img{border:none}a{text-decoration:none}:focus{outline:0}如果要在不支持html5的浏览器中使用html5标签，需要加一小段JavaScript代码
<script> document.createElement('header'); document.createElement('nav'); document.createElement('section'); document.createElement('aside'); document.createElement('article'); document.createElement('footer'); </script>
标签可编辑属性contenteditable
5148c1b640285f5056f70cb723d5fb367618f95bdc39e398f223d37049478af1
b541f80ac84f2ec0663a75212d0b81b4🎜🎜HTML 4.01 프레임세트🎜🎜7021f94c3e9f08f52bd6dd234464a465🎜🎜HTML5 문서 유형🎜🎜8b05045a5be5764f313ed5b9168a17e651e7ea7f445aebc88a47f535d3fcf70e 🎜🎜🎜meta🎜🎜🎜html5🎜 전에 문서🎜🎜에 사용된 문자 인코딩을 선언합니다.<p class="jb51code"><br>🎜rrreee🎜🎜SEO 최적화🎜🎜🎜 Title🎜🎜<code> < ;제목>제목6e916e0f7d1e588d4f442bf645aedb2f🎜🎜 페이지 설명🎜🎜 f825aa442d1115425c05586eaf3bb7c6🎜🎜 키워드🎜🎜 5381f57887dcdaab7eb95a6d022d14fe🎜🎜 웹 작성자🎜🎜 cf12f250ccd6249e8ab986cc7928dfc8 🎜🎜 웹 검색 엔진 색인 방법🎜🎜 34a1ab87b92f160f9b0228d438ea760c🎜🎜 follow 링크를 따라가며 대상 웹 페이지를 분석합니다. 이는 기본 동작이므로 무시할 수 있습니다. 🎜🎜 index 웹 페이지의 색인을 생성합니다. 이는 기본 동작이므로 무시할 수 있습니다. 🎜🎜 noodp는 콘텐츠 설명을 작성하기 위해 Open Directory 프로젝트를 사용하지 않습니다. 🎜🎜 noydir은 콘텐츠 설명을 작성하기 위해 Yahoo 디렉토리를 사용하지 않습니다. 🎜🎜 Noarchive는 검색 엔진이 캐시된 콘텐츠 버전을 표시하는 것을 허용하지 않습니다. 🎜🎜 캐시를 사용하면 검색 엔진이 콘텐츠의 캐시된 버전을 표시할 수 있습니다. 🎜🎜 Nocache는 검색 엔진이 캐시된 콘텐츠 버전을 표시하는 것을 허용하지 않습니다. 🎜🎜🎜 태그 🎜🎜🎜 문서의 구조를 정의하고 문서의 마크업을 보다 의미있게 만듭니다. 🎜
🎜rrreee🎜🎜tips🎜🎜🎜html5 태그가 더 풍부하고 완벽해 보입니다. p 태그는 쓸모가 없을 것 같지만 문서에 스타일을 추가하려는 경우에만 사용할 수 있습니다. , 이번에는 p 태그가 유용합니다. 🎜🎜태그의 기본 스타일은 브라우저마다 다릅니다. 웹페이지가 다른 브라우저에서 동일한 효과를 가지려면 일반적으로 먼저 태그 스타일의 형식을 지정해야 합니다🎜
🎜rrreee🎜html5를 지원하지 않는 브라우저에서 html5 태그를 사용하려면 JavaScript 코드의 작은 조각을 추가해야 합니다🎜
🎜rrreee🎜태그 편집 가능한 속성 contenteditable🎜🎜< ;article contenteditable>7618f95bdc39e398f223d37049478af1🎜
위 내용은 HTML의 기본 구문과 의미론적 사용 규칙에 대한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!