最近幫朋友研究作一個網站，雖然對很多人來說這是很簡單的事情，但是對我來說卻比較複雜！廢話不多講了，看看我找的HTML快速入門，說不定也會對你有幫助！
一、 HTML 的基本概念
HTML （ Hypertext Markup Language ）即超文本标記語言，它是一種用于編寫超文本文檔的标記語言—— 一種設計網頁的計算機語言。 HTML 可以控制任何文本的顔色、大小、形狀，圖像的大小和位置，網頁間不同元素的連結或者網址的連結。
自從 1990 年首次應用于網頁編輯後， HTML 迅速崛起成為網頁編輯的主流語言。幾乎所有的網頁都是由 HTML 或以其他程式語言嵌套在 HTML 中編寫的。 HTML 并不是一種程式語言，而是一種結構語言，它具有平台無關性。無論使用者使用何種作業系統（ Windows 、 Dos 、 Unix 等等），隻要有相應的浏覽器程式，就可以運作 HTML 文檔。
HTML 标記的寫法 :
" 任何标記皆由 "<" 、 ">" 所包圍，如 <P>
" 标記字母大小寫皆可。
" 标記名與 "<" 、 ">" 之間不能留有空格。
" 某些标記需要加上參數，某些則不必。如 <font size="6" color="#FFFFFF"> 人文風 </font>
" 參數隻可加到起始标記中。
" 在起始标記之标記名前加上符号 "/" 便是其終結标記，如 </font>
二、 HTML 常用标記
" HTML 檔案結構标記
以下這些标記是構成頁面的基本要素：
<Html>
<Head>
<Title> ... </Title>
</Head>
<Body> ...</Body>
</Html>
<Html> 是标志超文本的 HTML 頁面的開始，對應的 </html> 為結束标志 ;
<head> 檔案頭，中間的文本為整個檔案的序言，不包含太長文字内容，，而這些内容除 <Title> 标記之間的内容外，均不顯示在螢幕上
<Title> 給網頁命名，浏覽器通常會将檔案标題顯示在浏覽器視窗的左上角标題欄上
<body> 是 HTML 語言的主體，一般用來指明 HTML 文檔裡主要文字，如：标題、段落、清單等。也可定義首頁背景顔色。
下面是一個最基本的 html 頁面：
<HTML>
<HEAD>
<Title>a simple example page </title>
</HEAD>
<BODY>
頁面正文寫在這裡 ... ...
</BODY>
</HTML>
用編輯軟體編輯上代碼，儲存為以 .html 或 .htm 為字尾的檔案，就可在浏覽器中觀看頁面。
2. <Hn> 子标題标記
用于表示頁面中的各種子标題 , 标題标記有 6 種，分别為 H1, H2, … H6 ，标題号越小，字型越大。
<hn> 可以有對齊屬性， align ＝ # ， # 可為如下值
Left 标題居左
Center 标題居中
Right 标題居右
例：
<Title>How to make Web</title>
</Head>
<Body Bgcolor="#FFFFFF">
<h1> 标題元素顯示效果 </h1>
<h2 Align=Left> 标題元素顯示效果 </h2>
<h3 Align=Right> 标題元素顯示效果 </h3>
<h4 Align=Center> 标題元素顯示效果 </h4>
<h5> 标題元素顯示效果 </h5>
<h6> 标題元素顯示效果 </h6>
</Body>
</HTML>
如圖 :
2. <P> 分段标記
P 是段落 Pragraph 的縮寫，這是一個單标記，不需要結束标記，用來定義浏覽器中文檔中的一個段落。
單獨一個 <P> 會添加一個空行 , 該标記常作為 行斷點 ( 或 回車 ) 顯示。 P 标記能帶附加屬性。
Web 浏覽器不僅會忽略段落中的換行，而且會将文字之間的多個空白字元，如空格、制表符等都當作一個空格來顯示，浏覽器中文字的分段完全依賴于分段元素 <P>
比如下面兩段代碼有不相同的輸出。
<BODY>
<h2> This is one example </h2>
paragraphy 1
paragraph 2
<h2>This is Two example</h2>
paragraph one <p>
paragraph Two <p>
如圖：
如果需要在文字間插入多個空格，可以使用“＆ nbsp ”'，“＆ nbsp ”表示一個空格。
例如以下代碼的效果
風蕭蕭兮易水寒 <P>
<FONT SIZE=6 COLOR="#FF0000"> 壯士一去兮 &nbsp ; &nbsp 不複還 ! <FONT><P>
3 <DIV> 标記
這個标記可将檔案分為幾節，當檔案顯示時格式不受影響。尤其是在使用風格表格時， <DIv> 标記是一個強有力的工具。然而，現在 <DIV> 标記主要用來排放文字的位置，結合 Align 屬性，可将文字放置到視窗的左邊、右邊和中間。
浏覽器顯示時遇到 <DIV> ，标記就将文字斷行，後面的内容從新的一行開始顯示。
下面的 HTMl 檔案是 <DIV> 标記的應用示例，将三部分文字在螢幕的不同位置。效果如圖。
<DIV Align= Left > 測試靠左 </DIV>
<DIV Align=Center> 測試居中 </DIV>
<DIV Align=Right > 測試靠右 </DIV>
4. <BR> 分行标記
<BR> 标記可以強制句子在一行結束。 <BR> 标記告訴浏覽器在此處将文本截斷，從下一行的開始處接着顯示其餘文本。如：
人文風網站有如下一些欄目： <br>
影視天堂 <br>
音樂之城 <br>
線上直播 <br>
文學天地 <br>
成電女生 <br>
郵件系統 <br>
注意： <P> 也可以使文本分行，但會多一個空行
如：
成電女生 <p>
4. 清單 List
用于列舉，常用清單有 3 種格式 ：
" 即無序清單 (unorderedList)
" 有序清單 (ordered list)
" 定義清單 (definition list) 。
A. 無序清單 (Ul)
無序清單就是列出内容而不需要特别的序号
無序清單用 (Ul) 開始，每一個清單條目用 <Li> 引導，清單條目不需要結尾标記 </Li> ，整個清單以 </Ul> 結束。輸出時每一清單條目縮進，并以特殊符号标示。
例 ：
<Ul>
<Li>Today
<Li>Tomorrow
</Ul>
輸出如圖：
B. 有序清單 <Ol>
有序清單與無序清單相比，隻是在輸出時清單條目用數字标示 ;
例 :
<Ol>
</Ol>
C. 定義清單 <Dl>
定義清單用于對清單條目進行簡短說明的場合，用 <Dl> 開始，清單條目用 <Dt> 引導，它的說明用 <Dd> 引導。
<TITLE> China GongFu </TITLE>
<dl>
<dt> 南拳
<dd> 不拘形式，暗中出手，突然襲擊，以短打為主。
<dt> 北腿
<dd> 金戈鐵馬，氣勢磅礴，靜如處子 , 動如脫兔
<dt> 峨嵋派
<dd> 貼身近戰，出手毒辣，招招至殘
</dl>
D. 改變條目标記
a. 改變無序清單條目标記
無序清單輸出時，預設的條目标記為黑色圓點，用 type 屬性修改條目标
記。 type 可以是
" Disc 實心圓點 ( 預設屬性 )
" Circle 圓圈
" Square 小方塊
<ul>
<li type=disc> ONE
<li type=circle> TWO
<li type=square> THREE
</ul>
b. 改變有序清單條目标記
有序清單條目标記的預設值是阿拉伯數字，可用 type 屬性修改。方法為 <Li type=#>, # 的屬性見下表
屬性
含義
A
大寫英文字母
a
小寫英文字母
I
大寫羅馬數字
i
小寫羅馬數字
1( 數字 1)
阿拉伯數字 ( 預設值 )
例：
<ol>
<li type=A>ONE-ONE
<li> ONE-TWO
</ol>
<li type=a>ONE-ONE
<li> ONE － TWO
<li type=I>ONE-ONE
<li> ONE=TWO
<li type=i>ONE-ONE
<li type=1>ONE-ONE
</ol>
c. 改變有序清單條目的起始值
有序清單的條目值預設從 1 開始，用 start 屬性可修改。
方法為：
<ol start=#> # 是條目起始值
< ol start=5>
< ol start=10>
<li> TWO-ONE
<li type=i>TWO-ONE
< /ol >
< /ol >
如右圖：
d. 清單的嵌套
各種清單可以互相嵌套，每一個清單條目都可以是一個單獨的清單。每嵌套一層，清單條目的輸出就會有更大的縮進。請參照上面的例子。
5. 預排版文本 <pre>
PRE 是 Preformatted text ， ( 預排格式文本 ) 的縮寫．
我們提到，通常情況下，浏覽器将 HTML 文檔中文字之間的空白字元，如空格、制表符、換行等、不論有多少個，都視為一個空格來顯示。然而有時候我們需要浏覽器原封不動地顯示預先編排好格式的一段文本，如計算機的源程式、 ASCII 字元圖形等，這時就可以使用 PRE 标記。用來包含—段預先排好格式的文本， Web 測覽器将把起始标記 <PRE> 與結束标記 </PRE> 之間的文本按照原書寫的格式原封不動地再現出來。
<pre>
please use your card.
VISA Master
<b>Here is an order form.</b>
<li>Fax
<li>Air Mail
</ul>
</pre>
不加 <pre> 情況請自己實驗.
6. 居中
很多元素都有對齊方式屬性，如 < hn> 、 <p> 等。也可直接用居中标記
<Center> … < ／ Center>
如：
<TITLE> Test </TITLE>
<h3 align=center>
Wonderful!!!
</h3>
<center>
<h3> Wonderful!!! </h3>
</center>
若轉載請注明出處！若有疑問，請回複交流！
![跨域問題總結[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)