Html學(xué)習(xí)總結(jié)
1.什么是html:HyperTextMarket language军浆，超文本標(biāo)記語言,是用來描述網(wǎng)頁語言坯门，html使用標(biāo)記標(biāo)簽來描述網(wǎng)頁微饥，html不是編程語言，是一種標(biāo)記語言古戴。
2.經(jīng)歷過得版本:HTML2.0欠橘、HTML3.2、HTML4.0现恼、HTML4.0.1肃续、HTML5
3.H5新特性:
?用于繪畫的 canvas 元素
?用于媒介回放的 video 和 audio 元素
?對本地離線存儲的更好的支持
?新的特殊內(nèi)容元素，比如 article叉袍、footer始锚、header、nav喳逛、section
?新的表單控件瞧捌，比如 calendar、date润文、time姐呐、email、url典蝌、search
4.html都是由標(biāo)簽組成的
5.html的基本格式:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
<html>??
????<head>??
????????放置一些屬性信息曙砂，輔助信息。 ??
????????引入一些外部的文件骏掀。（css鸠澈，javascript） ??
????????它里面的內(nèi)容會先加載乔夯。 ??
????????meta：提供關(guān)于文檔的信息 ??
????????link：定義與外部資源的關(guān)系（css樣式） ??
????????style：在文檔內(nèi)容定義樣式 ??
????????script：定義腳本程序，或者外聯(lián)腳本文檔 ??
????????noscript：包含瀏覽器禁用腳本款侵，或不支持腳本時顯示的內(nèi)容 ??
????</head>??
????<body>??
????????存放真正的數(shù)據(jù)末荐。 ??
????</body>??
</html>??
- DOCTYPE:聲明文檔的版本
- meta：告訴瀏覽器一些關(guān)于該文檔的信息1.html注意事項:
?多數(shù)標(biāo)簽都是有開始標(biāo)簽和結(jié)束標(biāo)簽，其中有個別標(biāo)簽因為只有單一功能新锈，或者沒有要修飾的內(nèi)容可以在標(biāo)簽內(nèi)結(jié)束甲脏。
?想要對被標(biāo)簽修飾的內(nèi)容進(jìn)行更豐富的操作，就用到了標(biāo)簽中的屬性妹笆，通過對屬性值的改變块请，增加了更多的效果選擇。
?屬性與屬性值之間用“=”連接拳缠，屬性值可以用雙引號或單引號或者不用引號墩新，一般都會用雙引號】咦或公司規(guī)定書寫規(guī)范海渊。
h5全局屬性:
文本元素
XML/HTML Code復(fù)制內(nèi)容到剪貼板
-?br?換行 ??
-?wbr?軟換行，在英文文章中哲鸳，擴(kuò)大縮小瀏覽器的時候臣疑，遇到某一個長單詞的時候，<wbr>可以規(guī)定這個單詞從哪里切開徙菠。??
<a> 超鏈接讯沈，屬性:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
1.?href：url。 ??
2.?targert：頁面打開方式_blank新建頁面打開 ??
3.?錨點:也就是回到頂部那種婿奔。先在頂部定義一個id缺狠，然后在超鏈接中使用錨點跳去，href="#id"; ??
4.?如果href中指定的協(xié)議萍摊，瀏覽器不能解析挤茄，就會調(diào)用應(yīng)用程序，可以解析的程序就可以打開记餐。??
?abrr 縮略語
?b 不帶任何強(qiáng)調(diào)意義的標(biāo)記一段文字驮樊，加粗
?strong 表示重要內(nèi)容，加粗
?em 表示著重強(qiáng)調(diào)一段文字片酝，傾斜
?i 不帶任何強(qiáng)調(diào)意義的標(biāo)記一段文字囚衔，傾斜
?cite 表示作品標(biāo)題，將作品名傾斜
?del 表示從文檔中刪除的文字
?s 表示文字已經(jīng)不再準(zhǔn)確雕沿，也是刪除線
?u 不帶強(qiáng)調(diào)意義的給一段文字加下劃線
?ins 表示加入文檔的文字练湿，也是下劃線
?small 表示小號字體
?sub 表示下標(biāo)文字
?sup 表示上標(biāo)文字
?q 表示引自其它的內(nèi)容，被q標(biāo)簽修飾的自己加了引號表示引用
?pre 表示格式化一段文字审轮，也可以用來引入一段代碼
?span css中使用的添加樣式的模塊
?div會換行肥哎，span不會換行
?注釋
html實體
也就是在網(wǎng)頁中使用<辽俗，>,空格等。
<>
嵌入元素
1. 嵌入圖像
- img標(biāo)簽嵌入圖像
- src屬性:表示圖像的路徑
- alt屬性:表示圖像若顯示不出來顯示的內(nèi)容
- width/height屬性:設(shè)置圖像的寬和高
2. 嵌入一張網(wǎng)頁
- iframe標(biāo)簽表示嵌入一張網(wǎng)頁
- src屬性:表示超鏈接文檔的地址
- width/height:該區(qū)域的寬和高
- name:給iframe命名篡诽，方便以后a標(biāo)簽的target屬性調(diào)用<a href="shiti_test.html" target="iframe">進(jìn)入實體頁面</a>
3. 視頻/音頻 video/audio
- scr:路徑
- autoplay:自動播放視頻
- controls:顯示播放控件
- loop:循環(huán)播放
- width/height
4. 進(jìn)度條
- progress標(biāo)簽
- max屬性:規(guī)定任務(wù)一共需要多少工作 100%
- value屬性:規(guī)定已經(jīng)完成了多少任務(wù) 80%分組元素
1. p 段落標(biāo)簽崖飘，在開始和結(jié)束的位置上都會留下一段空行
- 屬性:align,對齊方式
2. hr 分割線
- 屬性:width寬度 100px或者30%
- align:對齊方式
- size:粗細(xì)
- color:顏色
3. 有序列表ol? li
- type:列表前的序標(biāo)號
- start:從第幾個開始
4. 無序列表ul li
5. 自定義列表
- dl:表示自定義列表
- dd:表示自定義列表項
- dt:表示自定義列表標(biāo)題
6. 區(qū)域
- div:聲明一塊區(qū)域
- span:聲明一塊區(qū)域 一般用于用戶名密碼之后的提示，例如:該用戶名已被注冊杈女。
- div與span的區(qū)別:div一長列朱浴，自動換行，span一短列达椰，不換行翰蠢。
7. 圖片區(qū)域
- figure圖片區(qū)域，里邊套img標(biāo)簽和figcaption和a標(biāo)簽等
- figcaption:表示對圖片的描述華為P9:3999帶回家8. pre:格式化一段文字或者添加代碼表格元素(重要)
- 作用:格式化數(shù)據(jù)
- table 聲明一個表格屬性:
1.border 邊框 border=1
2.width 寬度
3.cellpadding 文字與內(nèi)邊框的距離 cellpadding=10
4.cellspacing 單元格間距 cellspacing=0
?tr 行
1.align:對齊方式
?td 列
1.width/height
2.colspan 合并列
3.rowspan 合并行
?th 表頭啰劲，會加粗梁沧，并且會居中
?caption 表格的標(biāo)題
?給表格劃分區(qū)域(不常用)
1.thead、tbody蝇裤、tfoot
語義元素(不多用)
?h1~h6:表示標(biāo)題
?header:表示頭部
?nav:表示導(dǎo)航
?footer:表示尾部
?address:表示文檔或article的聯(lián)系信息
?aside:表示側(cè)邊欄
?section:表示主題區(qū)域
?article:表示一段獨立的內(nèi)容
XML/HTML Code復(fù)制內(nèi)容到剪貼板
<article>??
????????<h3>Internet?Explorer?9</h3>??
????????<p>Windows?Internet?Explorer?9（簡稱?IE9）于?2011?年?3?月?14?日發(fā)布.....</p>??
</article>??
????<!--header的使用方法-->??
????<header>??
????????<h3>Welcome?to?my?home?page</h3>??
????????<p>My?name?is?Luogg</p>??
????</header>??
???<!--section的使用方法-->??
????<font?color="blue"?size="4">3.<section>的定義</font><br/>??
????<section>?標(biāo)簽定義文檔中的節(jié)（section廷支、區(qū)段）。比如章節(jié)猖辫、頁眉酥泞、頁腳或文檔中的其他部分。<br/><br/>??
????<!--footer的使用方法-->??
????<font?color="blue"?size="4">4.<footer>的使用方法:</font>??
????<footer>??
????????<p>作者?:?Luogg</p>??
????????<p>聯(lián)系我?:?<a?>回到主頁</a>??
????</nav>??
框架(就是在一個頁面中展示多個頁面)啃憎，框架標(biāo)簽不能寫在body標(biāo)簽當(dāng)中或下面。不然瀏覽器無法解析似炎。
?frameset:框架結(jié)構(gòu)
?ros:將頁面分為n行
?cols:將頁面分為n列
?frame:放在框架中的每個html文檔
XML/HTML Code復(fù)制內(nèi)容到剪貼板
<frameset?rows="20%,*">??
???????<frame?src="top.html">??
???????<frameset?cols="15%,*">??
???????????<frame?src="left.html">??
???????????<frame?src="right.html"?name="right">??
???????</frameset>??
</frameset>??
表單元素(重點)
?作用:可以和服務(wù)器進(jìn)行交互
中的屬性:
1.action:定義一個URL辛萍，當(dāng)點擊提交按鈕時，向這個URL發(fā)送數(shù)據(jù)
2.method(get/post):用于向action URL發(fā)送數(shù)據(jù)的HTTP方法羡藐。默認(rèn)是get贩毕。
get和post區(qū)別：
1）get方式表單封裝的數(shù)據(jù)直接顯示在url上。post方式數(shù)據(jù)不顯示在url上仆嗦。
2）get方式安全級別較低辉阶，post級別較高。
3）get方式數(shù)據(jù)的長度瘩扼，post支持大數(shù)據(jù)谆甜。?input 標(biāo)簽:定義輸入字段，用戶可在其中輸入數(shù)據(jù)集绰。
input 中 type屬性:
1）type=text 文本框
2）type=password 密碼
3）type=radio 單選按鈕 name屬性
4）type=checkbox 多選按鈕
單選和多選都有默認(rèn)值：checked="checked"
5）type=reset? 重置按鈕
6）type=submit 提交按鈕
7）type=file? 上傳文件的輸入項
8）type=button 按鈕
9）type=image 圖片（也是提交按鈕规辱，）
10）type=hidden 隱藏標(biāo)簽（用戶不用看到的，但是咱們開發(fā)時必須要使用的栽燕，可以把數(shù)據(jù)封裝到隱藏標(biāo)簽中罕袋，和表單一起提交到后臺）
選擇標(biāo)簽
select /select>選擇下拉框 option 表示內(nèi)容 /option
文本域textarea
textarea 文本內(nèi)容 /textareavalue屬性:
對于按鈕改淑、重置按鈕和確認(rèn)按鈕：定義按鈕上的文本。
對于圖像按鈕：定義傳遞向某個腳本的此域的符號結(jié)果浴讯。
對于復(fù)選框和單選按鈕：定義 input 元素被點擊時的結(jié)果朵夏。
對于隱藏域、密碼域以及文本域：定義元素的默認(rèn)值榆纽。
注釋：不能與 type="file" 一同使用仰猖。
注釋：與 type="checkbox" 和 type="radio" 一同使用時，此元素是必需的掠河。?name屬性:為 input 元素定義唯一的名稱亮元。
以上這篇HTML5學(xué)習(xí)心得總結(jié)(推薦)就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考唠摹，也希望大家多多支持腳本之家爆捞。
