/**
*博客內容僅作學習交流之用，詳細內容參見更多網絡資源，歡迎大家交流探討！
*/
1 HTML簡介
HTML（Hyper TextMarkup Language）超文本標記語言，通過標記元素（標記符）定義文檔內容格式，超文本功能即鏈接功能，網頁之間通過指針起來。Html由國際組織W3C（萬維網聯盟）維護。
Html基本語法：
① 所有標記符都用尖括號”<>”括起來；
② 絕大多數標記符成對出現：開始標記符、結束標記符。限定標記的作用域，部分標記符單獨出現，如：水平線標記符<hr>，換行標記符<br>；
③ Html標記符不區分大小寫；
④ Html中沒有語句行概念，但爲了文檔的易讀性，建議採用合理的分段和縮進等格式。
Html對頁面內容的詳細控制實際上是通過設置標記符的相關屬性來完成的，標記符的所有屬性都包含在開始標記符的尖括號中，用“屬性=屬性值”表示。屬性值可用雙引號括起來，也可不用，多個屬性間用空格隔開。
網頁的基本結構：
<html>
<head>
<title>…</title><!—頭部分-->
</head>
<body>
…<!—主體部分-->
</body>
</html>
1. html標記符沒有屬性，因爲web文件後綴爲.html，或.htm，已表明文件爲Html文件，標記符可省略。
2. head標記符中不包含web的任何內容，包含web頁面信息，其中可包含其他標記符。
3. title標記符是頭部標記符中常用的，用於設置頁面的標題，用於顯示在瀏覽器頂部標題欄中。
4. body標記符包含了web頁的主體、整體效果屬性：
background 背景圖案
bgcolor 背景顏色，默認白色
text 字體顏色，默認黑色
link 超鏈接顏色，默認藍色
alink 當前選中超鏈接，默認紅色
vlink 訪問過的超鏈接，默認紫色
顏色可以用顏色的代碼（十六進制數值）或英文單詞。
Html的註釋由開始標記符<!—和結束標記符-->組成。
特殊符號代碼：在Html中默認是沒有空格的，像空格這樣的符號都會被瀏覽器會略（多個空格視作一個，回車不起作用）。
2 文本格式
字符格式
1.font
①face：可指定多種字體效果（逗號分隔），按順序顯示（若都無相應字體（系統內）），則使用默認字體，或相似字體代替；
②color：指定顏色，每次一種；
③size：字體大小（1~7），默認值爲3，超出範圍時以兩端極值代替，屬性值還可以用“+/-數字”來表示與默認值得關係。
2.字體樣式
|
樣式標記符 |
功能 |
樣式標記符 |
功能 |
|
<b></b> |
粗體 |
<strike></strike> |
刪除線 |
|
<big></big> |
大字體 |
<sub></sub> |
下標 |
|
<i></i> |
斜體 |
<sup></sup> |
上標 |
|
<s></s> |
刪除線 |
<u></u> |
下劃線 |
|
<small></small> |
小字體 |
|
|
可以單獨使用，也可以聯合使用（嵌套使用）。
3.hn
標題標記符，n爲1~6的數字，顯示爲黑體，在動在後換行。
段落格式
1.p(paragraph)
自動換行，保持間距。align(對齊)屬性：left、center、right、justify（兩端對齊）。
2.pre
預格式化標記，顯示時，按Html文檔中的格式。
3.hr(Horizontal Rule)
水平線，獨立標記符。作用是換行，繪製水平直線。屬性：①width：數值（像素）或百分比；②size：粗細（像素）；③noshade：陰影，布爾屬性，沒有具體取值（默認有陰影）；④align：left、center、right，默認爲居中；⑤color：顏色（IE支持）。
4.br(break)
獨立標記符，強制換行。新行與原來的屬性相同，在原來的段中。
列表格式
1.有序列表（ol, ordered list）（li, list item）
<ol>
<li>…</li>
<li>…</li>
</ol>
按規律排序，列表項標記<li>隱含換行作用，</li>常省略。
ol.屬性：type，編號樣式；start，起始編號。
li.屬性：type；value新序列起始值。
2.無序列表（ul, unordered list）
<ul>
<li>…</li>
<li>…</li>
</ul>
不對列表排序，使用特定項目符號排序。
ul、li.屬性：type（項目符號樣式），“disc”（實心圓），“circle”（空心圓），“square”（方框）。
3.嵌套列表
4.定義列表（dl, definition list）(dt, definition term)(dd,definition data)
dt，dd結束標記符可省略，隱含換行。dt,術語標記符、dd.術語定義標記符，內容自動縮進。
<dl>
<dt>…</dt>
<dd>…</dd>
<dt>…</dt>
<dd>…</dd>
</dl>
3 超鏈接與圖像
URL（universalresource locator，統一資源定位符）Html用URL定位web上的文件信息。
URL內容：
① 協議方式（常用：http、ftp、mailto），瀏覽器默認協議時超文本傳輸協議；
② 所需計算機地址（電子郵件地址，新聞組名稱）；
③ 文件名，文件地址的信息。
絕對URL：Internet上資源的完整地址（指定外部資源）；
相對URL：相對當前頁面的路徑，句點”.”和”..”雙重點，分別表示當前目錄和上一級目錄（父目錄）。
Html中的超鏈接：①頁面間；②頁面內；③指向電子郵箱，啓動默認收發郵件程序：Outlook express。
anchor
a. anchor（錨標），創建超鏈接標記符，超鏈接的源link超鏈接的目標。
屬性：href：定義描向的URL，若爲瀏覽器支持格式，則將在窗口中顯示，否則採用其他方式顯示（下載…）；
target：目標窗口，有框架結構，可指定在框架中顯示位置，否則，可將值設爲”_blank”在新窗口中顯示；
name：錨名稱，頁內鏈接使用。
可爲文字和圖片添加超鏈接：
1.頁面間超鏈接
2.頁面內超鏈接
①定義錨點；②創建指向錨點的超鏈接（順序、位置任意）；
頁面內具體位置的超鏈接也可以用在不同頁面中，在文檔創建錨點鏈接時增加另一頁面的地址（文件名，同一目錄），單獨的”#”表示空鏈接，不進行跳轉，擴展補充之用。
3.指向電子信箱的鏈接
語法：<a href:”mailto:E-mail地址”>…</a>
image
img. image獨立標記符，插入圖像標記符。
屬性：src：圖像位置，絕對URL或相對URL；
alt：圖片替換文字（關閉圖像顯示功能，鼠標停留圖片）；
width、height：（像素、百分比）爲圖像留出空間；
align：對齊方式，水平（left、right）垂直（top、bottom、middle）；
border：邊框（數值表示像素，可爲0）；
hspace、vspace：垂直、水平方向間距（數字表示像素點）。
使用圖像創建超鏈接：border設爲0則不顯示藍色邊框，鏈接目標文件爲圖片（瀏覽器支持的格式）也可以達到目標位web文件的效果。
圖像映射：將圖像分成不同的區域，然後每一個區域與一個Html文件建立鏈接。
<map name=”圖像映射名稱”>
<area>
<area>
…
</map>
<img src=”圖像名稱” usemap=”#圖像映射名稱”>
同頁面內超鏈接一樣，先定義映射名稱，再建立聯繫，無先後順序。
area屬性：shape：形狀（圖像劃分形狀）；
coords：座標（不同形狀需要的數字個數不同，像素）；
target：目標窗口；
alt：替換文字（區域圖像）。
4 網頁佈局
網頁佈局：table表格&frame框架
table
table：表格標記符；
tr：表格行；
th：表格單元格（表頭）；
td：普通單元；
table屬性：width、height：寬度，高度（像素、百分比）；
border：邊框；
bgcolor：背景色；
align：對齊方式（表格在網頁中的位置）（top、bottom、left、right）；
cellpadding：填充距（單元格內容，邊界），數字/像素；
cellspacing：單元格間距；
rules：分隔線：none（默認）、groups、rows、cols、all；
caption：表格標題；
tr table rules(錶行)、Html表格按行組織，可省略結束標記符。
align：水平對齊方式，left（默認）、center、right、justify；
valign：垂直對齊方式，top、middle（默認）、bottom、baseline；
bgcolor：背景色。
td table data（表格數據）
width（寬度）、height（高度）；
align（水平對齊）、valign（垂直對齊方式）；
bgcolor(背景色)；
rowspan（單元格的行數，默認值爲1）、colspan（單元格的列數，默認值爲1），實現合併拆分。
th table head（表頭）內容默認粗體、居中。
構造表格，從上到下，從左到右。
嵌套表格，表格佈局；嵌套框架，框架佈局。
frame
框架：能將瀏覽器窗口分割爲若干區域，可以看到不同的網頁，網頁之間互不影響（獨立，可鏈接），“框架集網頁”。
frameset，標記符，使用frame標記符，分割子窗口數目。<frameset>…</frameset>之間不能出現<body>，否則忽略所有框架定義。
屬性：raws（高度）、cols（寬度），值爲像素值，百分比，n*；
fram 標記子窗口，與劃分數對應，獨立標記符。
屬性：name：名稱（以字母開頭）；
src：源；
frameboder：框架邊框，默認爲1，表示可見；
marginwidth：框架左右邊距，像素；
marginheight：上下邊距；
scrolling：是否顯示滾動條，默認爲“auto”；
noresize：不允許調整框架尺寸。
指定超鏈接的目標框架，目標文件顯示的框架。
<a href=”目標文件” target=”目標框架名”>鏈接內容</a>，框架必須是框架值文件中指定的框架名，或特殊框架：
_top：整體瀏覽器窗口；
_self：當前框架（默認值）；
_blank：新瀏覽器窗口；
_parent：父框架，一般瀏覽器現實等同於_top。
創建頁面內框架
語法：<iframe>…</iframe>，屬性如fram，
如果瀏覽器支出頁面框架，頁面內框架顯示”src”中定義的Html文檔，否則顯示<iframe>…</iframe>內容。
5 表單&字母滾動
表單：用於手機信息，包含普通內容，控件（文本框…）、控件標籤…一部分是描述表單的Html源代碼，另一部分是用於處理用戶表單信息的服務器段應用程序。
控件：表單中用於接收數據的元素，具有一個初始值和一個當前值（字符串）。
form表單標記符
method：方法（表單數據提交方式），get在URL末尾附加發送信息（默認），post表單數據作爲一個數據體。
action：動作，對應處理程序，程序（ASP、PHP、JSP、Perl）的URL。
input：用戶輸入表單元素標記符，獨立標記符。
屬性：name
type：text（文本框）默認，還可以指定相關屬性（value, size, maxlength）
password（密碼文本框），信息被屏蔽；
checkbox（複選框），value，信息，checked，初始化選擇情況；
radio（單選框），一組單選框的name屬性值一樣；
submit（提交按鈕），value顯示按鈕上的文字；
reset（重置按鈕），…
image（圖像提交按鈕），…，須包括”src（源）”標記；
file（文件選擇框），…
button（創建自定義按鈕），…
hidden（隱藏控件），…
textarea（多行輸入），name, rows（文本域高度）, cols（高度）；
selectoption選擇列表表單元素，</option>可省略。
select（選擇列表），option（選項列表）；
select：name，size（默認爲1，列表項目數），multiple（多行顯示），多重選擇（bool）,
option：value（值），selected（選中初始默認項），
label：選擇選項或定位輸入點，爲控件指定標籤。屬性for：控件的id。
marquee滾動字幕
屬性：direction，left（默認）、right、up、down；
behavior：scrall（默認）、slide、alternate，
loop：循環、不設置則爲無限次，
scrollamount：速度，
scrolldelay：延時（千分之一秒），
align：height、wight，
bgcolor：hspace、vspace，
6 CSS
CSS（cascadingstyle sheets）是一種定義網頁格式的標準方法，級聯式樣式表或層疊式樣式表，是格式化網頁元素的標準方法，爲具有一定邏輯含義的內容設置統一的格式。使用方式：①直接嵌入樣式表；②鏈接外部樣式表；③導入外部樣式表；④內聯樣式表。
在<style>…</style>中定義CSS。樣式表項組成：seloctor{property1:value11,value12;property2:value21,…;…}
selector(選擇器，選擇符)爲需要應用樣式的對象，
property，由CSS標準定義的樣式屬性，
value表示標示屬性的值。
樣式表中的註釋語句/*…*/，不可嵌套。
selector種類：①Html標記符，如不同的seloctor包含相同的內容，採用編組方式定義樣式，seloctor之間以逗號分隔。
②具有上下文關係的Html標記符樣式，爲某個元素內的元素設置特定的樣式規則，上下關係可以嵌套任意多層。
③用戶定義的類：標記符類，使用類（class）來爲單一Html標記符創建多個樣式，定義：句點.類名。
selector.classname{property1:value;…}
在需要的地方使用class屬性應用這些類，標記符類樣式可以和標記符樣式共同使用。
通用類：定義能應用於所有標記符的類：（style中的類）
.classname{property1:value;…}
④用戶定義的ID：ID定義樣式，
#IDname{property:value;…}同樣在需要出使用id屬性。
⑤虛類：對於a標記符，可以用虛類的方式設置不同類型鏈接的顯示方式。
a:link/:link
a:visited/:visited
a:active/:active
a:hover/:hover
將CSS添加到HTML中：
① 直接嵌入樣式：在Html源文件的.head標記符中直接使用style標記符定義CSS，在body標記符內調用CSS。
② 鏈接外部樣式表：單獨創建一個樣式表文件（.css），在HTML文件中調用（在標記符head之間）。
link屬性：rel，鏈接文件和Html文件的關係；
href：鏈接文件位置（絕對、相對）；
type：鏈接文件類型.text/css，
一個Html文件可鏈接多個樣式表，如多個外部樣式表之間有衝突，則以後面的樣式爲準。
③ 內聯樣式表：可將style屬性與Html標記符body中的任何標記符聯合使用，每個聲明用分號隔開，每個屬性值用逗號隔開，該方式不易應用，不易修改。
若使用了同類樣式，優先級高的樣式將覆蓋優先級低的樣式，內聯樣式高於link標記的鏈接樣式，高於嵌入樣式。
CSS單元：長度單位（有效的相對單位，絕對長度單位）
百分比單位（相對長度）
顏色單位（#rrggbb,#rgb（十六進制）,rgb(x,y,z),rgb（x%,y%,z%））
CSS常用屬性：字體屬性，顏色及背景屬性，文本屬性，佈局屬性，列表屬性。
Web三種定位方式：靜態定位，絕對定位，相對定位。
6 JavaScript
使用javascript三種方式：①使用script標記符；②直接添加腳本；③鏈接腳本。
可以運行在客戶端的瀏覽器（客戶端腳本，解釋執行/執行前，無編譯預處理），也可以運行在服務器端（服務器端腳本，如其他的ASP，JSP，PHP），代替傳統的CGI程序。
①Javascript標記符：建議腳本放在head部分，使用<!--…//>，包括腳本，使不支持腳本的瀏覽器忽略腳本，可使用”//”或”/*…*/”註釋。
②直接添加腳本：（代碼較少時使用）。
③鏈接外部腳本：調用.js文件。
《Html&DHtml實用教程》
/**
*站在巨人的肩上才能看得更遠，一步一個腳印才能走得更遠。分享成長，交流進步，轉載請註明出處！
*/
