Hyper Text Mark-up Language（超文本標記語言）

超文本：超鏈接

標記語言：由標記（標簽）構成的語言

 !DOCTYPE html html lang= en !--html根標簽，代表html文檔的開始和結束-- head !--html的頭部分，設置網頁屬性，可以設置標題-- meta charset= UTF-8 title Hello World! /title /head body !--html的正文部分，放置想要在頁面上顯示的內容-- !--在HTML中不支持空格、制表符、回車-- h1 靜夜思 /h1 !--不分開始和結束的標簽，自閉合標簽-- p !--段落標記，有上下邊距即行間距-- font color= red size= 12 床 /font 前明月光， br / !--指定字體的顏色、大小-- 疑似地上霜， br / 舉頭望明月， br / 低頭思故鄉， br / /p hr / !--分隔符-- b 哈哈 /b br / !--加粗-- H sub 2 /sub O br / !--下標-- 2 sup 3 /sup br / !--上標-- /body /html 

 !DOCTYPE html html lang= en head meta charset= UTF-8 title 轉義字符 /title /head body 哈 nbsp;哈 br / !--空格-- a b nbsp;c d br / !--大于小于需要轉義，有可能誤當成標簽-- 1 3 2 br / !--標簽里不可以是數字，所以這樣寫直接就是 -- /body /html 

 !DOCTYPE html html lang= en head meta charset= UTF-8 title 列表標簽 /title /head body h2 愛好 /h2 ul type= square !--無序列表-- li 抽煙 /li li 喝酒 /li li 打游戲 /li /ul hr ol type= A start= 10 !--有序列表，從A的后十位開始-- li 小明 /li li 小強 /li li 小軍 /li /ol hr dl dt 水果 /dt dd 蘋果 /dd dd 草莓 /dd dd 香蕉 /dd dt 零食 /dt dd 辣條 /dd dd 奧利奧 /dd dd 綠豆糕 /dd /dl !--圖形標簽，border是邊界，alt是加載不出來顯示，title是鼠標放置時顯示的-- img src= image.png border= 1 width= 200 height= 200 alt= HTML title= 我是一張普通的圖片 /body /html 

 !DOCTYPE html html lang= en head meta charset= UTF-8 title 超鏈接 /title /head body !--a超鏈接標簽，href用于指定鏈接，以下的網頁在同一文件夾內，traget的_blank不覆蓋當前頁面，而是打開新的頁面-- !--href由協協議名+協議內容組成-- a href= 排版標記.html target= _blank 點我跳轉 /a br / a href= http://www.baidu.com 百度 /a br / a href= mailto:haiyu19931121@163.com target= _blank 聯系我們 /a br / a href= thunder://abcdefg.mp4 target= _blank 下載 /a br / a name= 回來 /a img src= image.png border= 1 width= 400 height= 400 br / img src= image.png border= 1 width= 400 height= 400 br / img src= image.png border= 1 width= 400 height= 400 br / img src= image.png border= 1 width= 400 height= 400 br / img src= image.png border= 1 width= 400 height= 400 br / img src= image.png border= 1 width= 400 height= 400 br / img src= image.png border= 1 width= 400 height= 400 br / a href= #回來 回到頂部 /a !--#表示使用本地超鏈接-- /body /html 

 !DOCTYPE html html lang= en head meta charset= UTF-8 title 表格標簽 /title /head body !--cellpadding是文字距離內邊框的距離，cellspacing是內邊框和外邊框的距離-- table border= 1 cellspacing= 0 width= 200 tr !--tr表示行-- th 姓名 /th !--表頭，自帶居中和加粗-- th 年齡 /th /tr tr td 小紅 /td !--td表示列-- td 13 /td /tr tr td 小強 /td td 15 /td /tr /table /body /html 

border是最外邊的藍線的寬度，不要理解成了內外邊框的距離，cellspacing才是。

如用一個頁面來顯示3個頁面，共需要四個。用4.html來顯示其他三個

4.html

 !DOCTYPE html html lang= en head meta charset= UTF-8 title Title /title /head frameset rows= 30%, 70% !--上下比例3:7-- frame src= 1.html / !--占了30%-- frameset cols= 30%, 70% !--左右比例3:7-- frame src= 2.html / !--占30%-- frame src= 3.html name= _mine / !--占70%，name為_mine,方便點擊2.html中的超鏈接轉到3.html中顯示-- /frameset /frameset /html 

1.html

 !DOCTYPE html html lang= en head meta charset= UTF-8 title Title /title /head body h1 首頁 /h1 /body /html 

2.html

 !DOCTYPE html html lang= en head meta charset= UTF-8 title Title /title /head body h1 首頁 /h1 /body /html 

3.html

 !DOCTYPE html html lang= en head meta charset= UTF-8 title 表格標簽 /title /head body !--cellpadding是文字距離內邊框的距離，cellspacing是內邊框和外邊框的距離-- table border= 1 cellspacing= 0 width= 200 tr !--tr表示行-- th 姓名 /th !--表頭，自帶居中和加粗-- th 年齡 /th /tr tr td 小紅 /td !--td表示列-- td 13 /td /tr tr td 小強 /td td 15 /td /tr /table /body /html 

 !DOCTYPE html html lang= en head meta charset= UTF-8 title 表單 /title /head body !--form標識表單范圍-- form action= # !--action決定提交的位置，還沒學服務器，先提交給自己，沒什么意義-- !--input type:決定輸入類型 name:提交的鍵 size:文本輸入框的長度 maxlenght:顯示文本框輸入長度（能輸入的字符個數） readonly:只讀，不能修改，不影響提交 disable:禁用，被禁用的表單項不會提交。所有的input屬性都能用 form action：提交的地址 method：提交的方法 get: 1、將鍵值對拼接在url地址 2、安全性不太好 3、提交的長度有限 post: 1、參數不在url地址 2、安全性比較好 3、理論上提交長度沒有限制 -- 用戶名： input type= text name= username value= admin disabled= disabled / br / !--name提交的鍵-- 密碼： input type= password name= password / br / !--name提交的鍵-- 性別：男 input type= radio name= sex value= male / 女 input type= radio name= sex value= female br / !--name提交的鍵-- 愛好：抽煙 input type= checkbox name= habit value= smoke 喝酒 input type= checkbox name= habit value= drink 吃零食 input type= checkbox name= habit value= eat br / 學歷： select name= edu option value= zk 專科 /option option value= bk 本科 /option option value= yjs 研究生 /option option value= bss 博士生 /option /select br / 個人說明： textarea rows= 10 cols= 30 name= desc 這家伙很懶，什么都沒留下 /textarea br / 近照： input type= file name= file br / !--隱藏了但是能提交-- input type= hidden name= haha value= heihei input type= submit / input type= reset / /form /body /html 

 meta http-equiv= Content-Type content= text/html;charset=UTF-8 !--指定字符集-- meta http-equiv= Refresh content= url= !--3秒刷新并定向到百度-- 

2017.3.7

by @sunhaiyu

以上就是HTML的介紹和使用方法的詳細內容，html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。