整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
.sublime使用的時(shí)候，頁面先要保存為html格式文件.
2.調(diào)出網(wǎng)頁骨架 html:xt 按ctrl+e 快捷鍵 html:5 ctrl+e 或者tab鍵
3.調(diào)整頁面字體大小的方法，按住ctrl+滾輪
4.div.top ctrl+e <div class="top"></div>
5.div*5 生成5個(gè)div
6.>子級(jí) (下一級(jí)) ul>li*5
7.+同級(jí)
8.按住滾輪可以豎著選
9.ctrl+shift+上下箭頭移動(dòng)一行
10.ctrl+shifit+大括號(hào) 折疊
快捷鼠標(biāo)操作
tml的主體結(jié)構(gòu)
標(biāo)簽的分類
標(biāo)簽的關(guān)系
sublime快捷鍵
單標(biāo)簽
雙標(biāo)簽
路徑
超鏈接額外知識(shí)運(yùn)用
錨點(diǎn)
空連接
超鏈接的優(yōu)化寫法 寫在head標(biāo)簽中
特殊標(biāo)記符
列表
<!doctype html><html><head>
單標(biāo)簽
<!doctype html>
雙標(biāo)簽
<head></head>
包含（嵌套關(guān)系、父子關(guān)系）
<head>
并列
<head></head><body></body>
| 快捷鍵 | 作用 |
|---|---|
| html:xt + tab | html4.01模板【新版本可能失效】 |
| html + tab | html5模板 |
| tab | 補(bǔ)全標(biāo)簽 |
| ctrl + shift + d | 快速復(fù)制一行 |
| ctrl + shift + k | 快速刪除一行 |
| ctrl + 鼠標(biāo)左鍵單擊 | 集體輸入 |
| ctrl + h | 查找替換 |
| ctrl + f | 查找 |
| ctrl + / | 注釋 |
| ctrl + L | 快速選中當(dāng)前行 |
| ctrl + shift + ↑(↓) | 代碼的快速上移和下移 |
<!-- --> 注釋標(biāo)簽<br /> 換行標(biāo)簽<hr /> 水平線標(biāo)簽<img src="logo.gif" alt="logo" title="這是淘寶的logo" width="200" height="100" />圖片標(biāo)簽
<p></p> 段落標(biāo)簽<h1></h1> 標(biāo)題標(biāo)簽 h1 - h6<font></font> 文本標(biāo)簽<strong></strong> 文本加粗標(biāo)簽，有語音加強(qiáng)<b></b> 文本加粗標(biāo)簽<em></em> 文字傾斜，有語音加強(qiáng)<i></i> 文字傾斜<del></del> 刪除線，有語音加強(qiáng)<s></s> 刪除線<ins></ins> 下劃線，有語音加強(qiáng)<u></u> 下劃線<a title="百度" target="_blank">百度</a> 超鏈接
相對(duì)路徑
同一個(gè)目錄下直接寫文件的名稱就可以
文件和圖片在下一級(jí)目錄中，需要文件夾名稱 + \ + 文件名稱
圖片在上一級(jí)目錄中 ../ + 文件名稱
圖片在上一級(jí)的其它文件夾中 ../ + 文件夾名稱 + 文件名稱
總結(jié)：找到下級(jí)目錄使用/，找到上一級(jí)目錄使用../
絕對(duì)路徑
從盤符中開始的，這種路徑不能使用！因?yàn)轫?xiàng)目最后都要移動(dòng)，文件的路徑都是會(huì)變的。如：c:\baidu\logo.jpg
錨點(diǎn)
1.設(shè)置一個(gè)錨點(diǎn) 設(shè)置一個(gè)id
<div id="top"></div>
2.超鏈接到錨點(diǎn)
<a href="#top"></a>
空連接
<a href="#"></a>
超鏈接的優(yōu)化寫法 寫在head標(biāo)簽中
<base targer="_blank">
讓所有的超鏈接都是從新窗口中打開
| 空格 | |
|---|---|
| < | < |
| > | > |
| ? | © |
更多信息請查閱
無序列表
<ul type="disc">
類型：disc 默認(rèn)小黑點(diǎn) circle 空心小圓點(diǎn) square 小方塊
有序列表
<ol type="A" start="C">
類型：a A 字母順序 i I羅馬順序 1數(shù)字 start 表示開始的位置
自定義列表
<dl>
嘍大家好，我是作者“未來”，本期分享的內(nèi)容是Web前端系列課程，本系列總共29個(gè)階段，堅(jiān)持學(xué)習(xí)3個(gè)月蛻變?yōu)閃eb前端高手哦！
志同道合的小伙伴跟我一起學(xué)習(xí)交流哦！
1 html5文檔類型和字符集
Html的發(fā)展歷程：
文檔類型設(shè)定
Document
HTML: sublime輸入html:4s
XHTML: sublime輸入html:xt
HTML5：sublime輸入html：5或者！顯示
2 查看手冊及其新增標(biāo)簽
常用新標(biāo)簽（需掌握）
W3c手冊中文官網(wǎng)：w3school
header：定義文檔的頁眉 頭部
nav：定義導(dǎo)航鏈接的部分
footer：定義文檔或節(jié)的頁腳 底部
article：定義文章。
section：定義文檔中的節(jié)（ section區(qū)段）
aside：定義其所處內(nèi)容之外的內(nèi)容 側(cè)邊
datalist：定義選項(xiàng)列表。與 input元素配合使用該元素
Fieldset：可將表單內(nèi)的相關(guān)元素分組，打包
3 datalist標(biāo)簽
有提示的下拉菜單
4 fieldset元素
fieldset元素可將表單內(nèi)的相關(guān)元素分組、打包， 和legend搭配使用
5 HTML5新增 iInput表單（一）
6 HTML5新增 input表單（二）
7 新增占位符焦點(diǎn)多選屬性
8 autocomplete屬性
輸入內(nèi)容自動(dòng)記錄，方便下次快速輸入
autocomplete必須滿足兩個(gè)條件才會(huì)起作用，一是必須有提交按鈕，二是必須給給他名字，名字是什么無所謂，例如上面“123”
9 內(nèi)容不能為空和獲得焦點(diǎn)屬性
required是提示輸入內(nèi)容不能為空
accesskey是一個(gè)快捷鍵屬性，如上字母“s”,意思是在頁面中按“ctrl+s”可以將光標(biāo)移至此文本框
10 表單綜合案例學(xué)生檔案
顯示效果如下（馬賽克不算）：
11 embed引入網(wǎng)上視頻
多媒體標(biāo)簽 embed：定義嵌入的內(nèi)容，embed可以用來插入各種多媒體，格式可以是Mid、Wav、AFF、AU、MP3等等。Url為音頻或視頻文件及其路徑，可以是相對(duì)路徑或絕對(duì)路徑
因?yàn)榧嫒菪詥栴}，我們這里只講解插入網(wǎng)絡(luò)視頻，后面H5會(huì)講解audio和video視頻多媒體。
12 播放音頻 audio
autoplay是自動(dòng)播放，controls是顯示播放器，Loop是循環(huán)次數(shù)
每個(gè)瀏覽器的顯示樣式有所不同，每個(gè)瀏覽器支持的音頻格式有所不同
Source可以提供多個(gè)音頻格式，以便兼容各種瀏覽器。
13 播放視頻 video
跟音頻播放用法一樣
看不懂的小伙伴不要?dú)怵H，后續(xù)的分享中將持續(xù)解釋，只要你跟著我分享的課程從頭到尾去學(xué)習(xí)，每篇文章看三遍，一個(gè)月后，回過頭來看之前的文章就會(huì)感覺簡單極了。
第一階段HTML5的所有章節(jié)都已結(jié)束，下篇文章將分享《第二階段 CSS3》小伙伴們不要錯(cuò)過喲！
?
*請認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
