検索

ホームページ >ウェブフロントエンド >htmlチュートリアル >HTML スケルトン構造_html/css_WEB-ITnose

HTML スケルトン構造_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:32:45948ブラウズ

Directory

[1] 文書構造 [2] 文書宣言 [3] 文書ヘッダー [4] 文書本体

文書構造

完全な HTML 文書には、文書宣言、文書ヘッダー、文書ヘッダーの 3 つの部分が含まれている必要があります。文書本体。

【最も単純な文書構造】

<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title>Document</title></head><body></body></html>

【複雑な文書構造】

<!DOCTYPE html><html><head>    <meta charset="utf-8"/>    <title>Document</title>    <meta name="keywords" content=""/>    <meta name="description" content=""/>    <meta name="viewport" content="width=device-width"/>    <link rel="stylesheet" href="5/style.css"/>    <link rel="shortcut icon" href="ico.ico"/></head><body></body></html>

文書宣言

HTML文書の解析に使用する標準をブラウザに指示します

[メモ] 』に違いない。最初の行、先頭の形式、大文字と小文字は区別されません

バージョン年HTML 2.01995HTML 3.21996HTML 4.011999XHTML 1.02000HTML52014
HTML 1991
HTML+ 1993

【よく使われる文】

【1】HTML5

<!DOCTYPE html>

【 2 】前HTML5では、文書宣言は、strict、transitional、framesetの3種類が一般的でした

【a】HTML4.01

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

【b】XHTML1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

【c】 XHTML1.1は以下と同等ですXHTML1.0 Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

ドキュメントヘッダ93f0f5c25f18dab9d176bd4f6de5d30e

ドキュメントのいくつかの基本的な属性と情報を記述します(タイトルとアイコンを表示可能)

【1】ドキュメントタイトル <p>ログUp in in in in>>>> in in in all HTML documentb2386ffb911b14667cb8f0f91ea547a7 </p> 【 3】リンクタグ <p> <br> 【a】アイコンの導入 <br> <br> <pre class="precsshui"><base href="http://baidu.com" target="_blank"></pre> </p> <p> 【b】外部 CSS スタイルシートの導入 </p> <p> <pre class="precsshui"><link rel="shortcut icon" href="ico.ico"/></pre> </p> <p> </p> <p> 【4】styleタグとscriptタグ</p> <p class="sycode"> 【a】内部CSSスタイルの導入</p> <p> <pre class="precsshui"><link rel="stylesheet" type="text/css" href="mystyle.css" /></pre> </p> <p> 【b】JavaScriptの導入 </p> <p> <pre class="precsshui"><style>　　body{background-color: red;}</style></pre> </p> <p class="sycode"> </p> <p> 【5】metaタグ </p> <p class="sycode"> 【 a】文字コード、エンコーディングドキュメントのエンコーディングはファイル自体のエンコーディングと一致している必要があります。そうしないと文字化けが発生します。UTF-8 コーディングを使用することをお勧めします</p> <p> <pre class="precsshui">document.onclick = function(){　　alert('hello world;')}</pre> </p> <p> 【b】SEOでよく使われるキーワードや説明文（他のWebページにジャンプします） </p> <p> <pre class="precsshui"><meta charset="utf-8"/></pre> </p> <p class="sycode"> 【e】ピリオド（キャッシュ内のWebページの有効期限を指定）</p> <p> <pre class="precsshui"><meta name="description" content="Free Web tutorials on HTML, CSS, JavaScript" /><meta name="keywords" content="HTML, CSS, XML" /></pre> </p> <p class="sycode"> 【f】Cache</p> <p> <pre class="precsshui"><meta name="author" content="littlematch"><meta name="copyright" content=""></pre> </p> <p> 【g】Cookie</p> <p> <pre class="precsshui"><meta http-equiv="refresh" content="5"><meta http-equiv="refresh" content="5;url=http://www.baidu.com"></pre> </p> 【h 】ビューポート:モバイル端末でよく使われるビューポート <p class="sycode"> </p> <pre class="precsshui"><meta http-equiv="Expires" Content="0"><meta http-equiv="Expires" Content="Sat Nov 28 2015 21:19:15 GMT+0800"> </pre> <p> </p> <p class="sycode"> </p>Document body6c04bd5ca3fcae76e30b72ad730ca86d<p> </p> 実際にページ上で見られるコンテンツ<p class="sycode"> </p> 【共通タグ】<p> </p> <pre class="precsshui"><meta http-equiv="Pragma" Content="No-cach">(禁止缓存，访问者无法脱机浏览)</pre> <p class="sycode"> </p> HTML5では標準 次へ使用できるタグと使用できないタグについては、HTML 要素と有効な DTD に移動してください。 <p></p>
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：セカンダリ メニューを header_html/css_WEB-ITnose にすることはできません次の記事：セカンダリ メニューを header_html/css_WEB-ITnose にすることはできません

関連記事

続きを見る