HTML学習ノート1
4147 ワード
注意:Webページは主にHTML:Structure CSS:プレゼンテーションJavaScript:動作(Behavior)の3つの部分から構成されています.
HTML(一)
< !DOCTYPE html>:HTMLバージョンの宣言(HTML 5)
タブ
1.htmlタグ:HTMLドキュメント全体を定義する……2.headラベル:スクリプト、スタイル、meta情報、その他の詳細を含むドキュメントのタイトル(title)を含むすべてのヘッダーラベル要素が含まれています.(例:、)<head>......</head>例:<pre><code>
……
</code></pre> <br>3.bodyラベル:ドキュメントのすべてのコンテンツ(テキスト、ハイパーリンク、画像、表、リストなど)を含むドキュメントのボディを定義します(例:<p>)html基本構造:<pre><code>
</code></pre> <br>4.metaタグ:<meta>要素は、検索エンジンや更新頻度の説明やキーワードなど、ページに関するメタ情報(meta-information)を提供します.<meta>ラベルは、ドキュメントのヘッダにあり、何も含まれていません.ラベルのプロパティは、ドキュメントに関連付けられた名前/値のペアを定義します.HTMLでは、<meta>タグに終了タグはありません.すなわち、</meta>が中国語のWebページに対して<meta charset="utf-8">を使用して符号化を宣言する必要はありません.そうしないと、文字化けしてしまいます.一部のブラウザでは、GBKをデフォルトのエンコーディングに設定する場合は、<meta charset="gbk">に設定する必要があります.メタデータは、ブラウザ(コンテンツの表示方法やページの再ロード方法)、検索エンジン(キーワード)、その他のWebサービスで使用できます.検索エンジンのキーワードを定義します:<meta name="keywords"content="HTML,CSS,XML,XHTML,JavaScript">Webページの説明内容を定義します:<meta name="description"content="Free Web tutorials on HTML and CSS">Web作成者を定義します:<meta name="author"content="Hege Refnes">現在のページを30秒ごとにリフレッシュします:<meta http-equiv="refresh"content=“30” > 5.タイトルラベル:HTMLドキュメントのタイトルが定義されています<br>6.pラベル:段落の定義<br>7.hラベル:タイトルを定義し、h 1はメインタイトル、h 2はサブタイトル、h 3、h 4、h 5、h 6はフォントのサイズを順次減算する.最大h 6ラベルhラベルまでid、nameなどの属性例:<h 2 id="h 2 title">これは2級タイトル</h 2><br>8.aラベル:リンクを定義し、外部アドレスにリンクしてページジャンプ機能を実現するか、現在のページの一部にリンクして内部ナビゲーション機能を実現することができます.<a>ラベルにはhrefプロパティが含まれており、hrefプロパティでリンクのアドレスを指定できます.このアドレスはウェブサイトでもhtmlファイルでも構いません.例:<a href="http://www.w3cschool.cn「>これは、ラベル</a><a href="#」>ページ上部</a><a href=「#h 2 title」>にジャンプして2段タイトル</a>のデフォルトのリンクされたドキュメントにジャンプすると、元のウィンドウで開きます(元のページから新しいページにジャンプします).targetプロパティが「_blank」に設定されている場合、ドキュメントは新しいウィンドウで開きます(新しいページが開きます).例:<a href=「//www.w 3 cschool.cn/」target=「_blank」>W 3 CSchoolチュートリアルにアクセスします!<a > < a href=“http://www.w3cschool.cn/” style=“text-decoration:none;”>w 3 cschoolにアクセスします.cn!</a>styleプロパティを使用して、下線のないリンクを作成します.9.imgラベル:画像ラベル、img要素を使用してあなたのウェブサイトに画像を追加し、src属性を使用して1つの画像の具体的なアドレスを指し、画像の名前とサイズは属性の形式で提供され、img要素は自己閉鎖要素であり、終了マークは必要ありません.例:<img src="image/noimage.jpg"width="104"height="142"alt="このピクチャがない">alt属性定義ピクチャのロードに失敗したときに表示される文字.絶対アドレスと相対アドレス:"./"は現在のファイルが存在するディレクトリの下を表し、例えば"./pic.jpg"は現在のディレクトリの下のpicを表す.jpgの画像は、この使用時に省略できます.「.../」は、現在のファイルが存在するディレクトリの下の上位ディレクトリを表し、例えば「.../images/pic.jpg」は、現在のディレクトリの下の上位ディレクトリの下のimagesフォルダの中のpicを表す.jpgの画像.10.hrラベル:HTMLページに水平線を作成し、内容を区切ることができます.この要素を使用して生成された水平線を使用して、ドキュメントを視覚的に各部分に区切ることができます(使用:<hr>または<hr/>、hrは空の要素です).デフォルトでは、HTMLは、段落、タイトル要素の前後11などの追加の空白行をブロックレベル要素の前後に自動的に追加します.注記:<!--これはコメントです->12.brラベル:<br/>または<br>を使用すると、コンテンツをセグメント13にするのではなく、空の行を簡単に入力することができると理解できます.preラベル:表示されるフォーマットがコード書き込みフォーマットと一致するように、プリフォーマットテキストを定義し、デフォルトではスペースと空白行がマージされます.baseタグ:HTMLドキュメント内のすべてのリンクタグのデフォルトリンク例としてheadに<base href="を追加する基本的なリンクアドレス/リンクターゲットについて説明します.http://www.w3cschool.cn/statics/images/w3c/「target=「_blank」>はbodyで<img src=「logo.png」>-ここではピクチャの相対アドレスを設定していることに注意してください.正常に表示できるのは、headセクションにbaseラベルを設定し、ページ上のすべてのリンクのデフォルトURLを指定しているため、この画像のアクセスアドレスは「http://www.w3cschool.cn/statics/images/w3c/logo.png "< a href=“http://www.w3cschool.cn">W 3 Cschoolチュートリアル-target="_がなくても、このリンクが新しいウィンドウで開くことに注意してください.blank「プロパティ」.baseタグにtargetプロパティの値を「_blank」に設定したためです.15.styleタグ:HTMLドキュメントをレンダリングするためにスタイルファイルを指定できます.例:ページの背景色と段落の文字色を指定できます.<pre><code>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</code></pre> <br>16.scriptラベル:JavaScriptなどのスクリプトファイルをロードします.17.linkラベル:外部スタイルシート(headに配置)にリンクします.例:<link rel="stylesheet"type="text/css"href="/statics/demosource/styles.css">
HTML(一)
< !DOCTYPE html>:HTMLバージョンの宣言(HTML 5)
タブ
1.htmlタグ:HTMLドキュメント全体を定義する……2.headラベル:スクリプト、スタイル、meta情報、その他の詳細を含むドキュメントのタイトル(title)を含むすべてのヘッダーラベル要素が含まれています.(例:、