コード表示

<!DOCTYPE html>
<html>
<!--告诉浏览器html从这里开始-->
<head>
 	<meta charset='UTF-8'>
 	<title>这是标题，会显示在浏览器的标题栏</title>
 	<style type='text/css'><!--属性type可以告诉浏览器你在使用什么类型-->  
 	<!--body{}里不能有注释，这里是为了方便阅读添加了注释-->
   	body{background-color:#d2b48c;<!--设置背景颜色为土黄色,#d2b48c是十六进制代码-->
  		 margin-left:20%;<!--页面左边距占页面的20%-->
 		 margin-right:20%;
    		 border:2px dotted black;<!--定义页面主体周围的边框是虚线，颜色为黑色-->
    		 padding:10px 10px 10px 10px;<!--在页面主体周围创建一些页边距(顺时针)-->
   		 font-family:sans-serif;}<!--定义文本使用的字体--> 
</style>
</head>
<!--这是注释，内容不会显示在浏览器中-->
<body>
	<!--body的内容会显示在浏览器中-->
	<h1 align='center'>这是标题</h1><!--描述标题在页面居中-->
	<hr /><!--创建一条水平线在h1和h2中间-->
	<h2>这是标题</h2>
 	<h3>这是标题</h3>
	<h4>这是标题</h4>
 	<h5>这是标题</h5>
 	<h6>这是标题</h6><!--描述文本为粗体，且数字越大，字号越小-->
	<p id='指定内容'>这是段落<br />段落的行数随浏览器窗口大小改变</p>
 	<!--br标签描述换行-->
 	<img src='1.jpg'>
	<a href='http://www.baidu.com'>百度一下，你就知道</a>
 	<a href='1.jpg'>你懂的</a><!--href指向相同文件夹中的页面-->
 	<a href='../python/猜数游戏.py'>嘿嘿嘿</a>
 	<a href='#指定内容' target='_blank'>111</a><!--在新窗口打开链接，并且页面滚动到<p>处-->
 	<q>用于短引用，作为现有段落的一部分，有的浏览器会把引用内容加上双引号</q>
	<blockquote>用于长引用，创建了单独的一个文本块,还把文字稍稍缩进，使它更像一个引用。</blockquote>
 	<blockquote>现在在段落里放入<br>标签，表示换行</blockquote>
 	<em>元素告诉浏览器把其中的文本表示为强调的内容。 对于所有浏览器来说，这意味着要把这段文字用斜体来显示。</em>
	<strong>标记你希望的特别强调的文本，加粗显示</strong>
	<ol><!--创建一个有序列表-->
  		<li>北京</li>
 		<li>上海</li>
  		<li>广州</li>
  		<li>深圳</li>
 	</ol>
 	<ul><!--创建一个无序列表-->
 		<li>北京</li>
  		<li>上海</li>
  		<li>广州</li>
  		<li>深圳</li>
 	</ul>
	<dl>
  		<dt>列表中每一项都有一个定义术语< dt ></dt>
  		<dd>和一个定义描述< dd ></dd>
 	</dl> 
 	<p>我们在每天早上 <time>9:00</time> 开始营业。</p>
 	<p>我在 <time datetime="2016-02-14">情人节</time> 有个约会。</p>
 	<!--time告诉浏览器这个内容是一个时间或日期，或者同时包含时间和日期-->
 	 <pre>
 		希望浏览器按你的输入方式原样输入文本时，使用这个元素来指定文本的格式
 	</pre>
 	<code>
	 显示计算机程序代码
 	</code>
</body>
</html>

補足コンテンツ

1. <a>要素

1.構文href属性：<a href = “value”> xxx </ a>
value：ハイパーリンクのURL。可能な値：

別のサイトへの絶対URLポイント（例：href = "http://www.example.com/index.htm"）
サイト内のファイルへの相対URLポイント（href = "" index.htm "）
アンカーURLは、ページ内のアンカー（href = "＃top"）の
相対パスを指します。
現在のフォルダー（a）のサブフォルダー（b）にある画像（1.jpg）へのリンク：<a href ='b / 1.jpg'> 1 </ a>
現在のフォルダー（a）の親フォルダー（c）にある画像（2.jpg）へのリンク：<a href='…/2.jpg'> 2 </ a>
「…」を使用するたびに、上位レベルのフォルダー。2つのレベルのフォルダーをアップロードする場合は、「…/…」と入力できます。

2.構文のタイトル属性：<a href = “value1” title = “value2”> xxx </ a>
値：value2は、value1によってリンクされたWebサイトの一般情報を示します。
機能：ユーザーがxxxの上にマウスを置くと、value2が表示されます。視覚障害のあるユーザーの場合、ブラウザがリンクのタイトルを読み上げることがあります。もう1つは、任意の要素にタイトル属性を追加できることです。

3.id属性
機能：別のWebページの指定されたコンテンツにリンクできます。
使い方：

リンクするターゲット、通常はターゲットページのタイトルを決定し、id = '指定されたコンテンツ'をターゲットページのソースコードに追加します。たとえば<h1 id='指定内容'>、この指定されたコンテンツのターゲットIDは一意である必要があります。
元のページの<a>要素に追加されました<a href='目标网页的URL#指定内容'>。指定したコンテンツが元のWebページにある場合は、hrefでターゲットWebページのURLを省略できます。
この時点でターゲットWebページのリンクをクリックすると、ブラウザはターゲットWebページを指定されたコンテンツに自動的にスクロールします。

4.target属性
機能：リンクを新しいウィンドウで開く
構文：<a target='_blank' href='xxx'>xxxx</a>
ここに画像の説明を挿入

2. <br>要素

改行を示します。
要素=開始タグ+コンテンツ+終了タグ
<br>にはコンテンツがなく、無効な要素です。<img>もvoid要素です。

3.ブロック要素とインライン要素

ブロック要素：<h1>、<h2>…<p>、<blockquote>
各ブロック要素は、前後に改行があるかのように個別に表示され、コンテンツはブロックで表示されます。

インライン関数：<q>、<a>、<em>が
段落に表示されます。

4.リストを作成する

ステップ1：各リスト項目を<li>要素に配置します。
ステップ2：<ol>または<ul>でリスト項目を囲みます。
<ol>は順序付きリストを示します
<ul>は順序なしリストを示します
*順序付きリストと順序なしリストに加えて、定義リストがあります：

<dl>
 	<dt>列表中每一项都有一个定义术语</dt>
  	<dd>和一个定义描述</dd>
</dl>

5.キャラクターエンティティ

ブラウザに<and>を表示する必要がある場合、またはWebページで特定の文字を使用したいが、エディタが入力できない場合（著作権文字など）、記号の対応する略語である文字エンティティを使用する必要があります。文字エンティティは、www.unicode.orgおよびwww.w3cschools.comで見つけることができます。
たとえば、次のとおりです。

<的缩写是"&lt ;"
>的缩写是"&gt ;"
< html >可以写成&lt;html&gt;

6. <pre>要素

事前にフォーマットされたテキストを定義できます。pre要素で囲まれたテキストは、通常、スペースと改行を保持します。テキストも等幅フォントとしてレンダリングされます。
<pre>タグの一般的なアプリケーションは、コンピューターのソースコードを表すことです。
段落の分割を引き起こす可能性のあるタグ（見出し、<p>、<address>タグなど）は、<pre>で定義されたブロックに含めないでください。

7. URL

ここに画像の説明を挿入

絶対パス：ルートフォルダーから特定のページまたはファイルに到達する方法をサーバーに伝えます。たとえば、ルートフォルダーはaで、必要なページcはaのサブフォルダーbにあるため、絶対パスは "/ b / c"です。
ブラウザがhttp://www.xxx.com/imageやhttp://www.xxx.com/などのファイルの代わりにサーバーからディレクトリ（フォルダ）を要求すると、Webサーバーはデフォルトのファイル、通常はデフォルトのファイル名は「index.html」または「default.hml」です。サーバーがそのようなファイルを見つけると、ブラウザーに表示して表示します。
したがって、デフォルトでルートディレクトリ（またはその他のディレクトリ）からファイルを返すには、ファイルに「index.html」または「default.hml」という名前を付けます。
しかし、リクエストの最後に「/」がない場合があります。Webサーバーが最後に「/」なしでリクエストを受信し、このディレクトリが存在する場合、サーバーは最後に「/」を自動的に追加し、サーバーがデフォルトを検索できるようにします。ファイルし、最後にこのファイルを返します。