1.1 復(fù)習(xí)markdown常用語法
| name | age | sex |
|---|---|---|
| 前端 | 6 | 你猜 |
>***- 單行代碼(``)和代碼塊
里面寫代碼塊
1.2 復(fù)習(xí)常用的快捷鍵
- ctrl:ctrl+a ctrl+c ctrl+v ctrl+x ctrl+s ctrl+alt場景切換 ctrl+w關(guān)閉當(dāng)前頁面 ctrl+空格:中英文切換
- shift：1）中英文切換(不建議) 2)大寫英文字母
- windows+r打開運(yùn)行窗口测柠，在運(yùn)行窗口中輸入cmd,可以打開命令行;
- 創(chuàng)建html5的快捷鍵：1）!+tab 2)html:5+tab;
- 在style中注釋：ctrl+shift+/
1.3 復(fù)習(xí)html
- html骨架結(jié)構(gòu)
- !DOCTYPE..文檔聲明頭(html5,html4.01,XHTML)
- 在html4.01和XHTML中各有3個小規(guī)范
- strict 嚴(yán)謹(jǐn)?shù)?/li>
- transitional 普通的
- frameset 框架
- html：超文本標(biāo)記語言；里面用的都是"標(biāo)簽對兒"
- head
meta（charset:UTF-8,GB2312）<meta name="description" content="要描述的內(nèi)容"/>-
<meta name="keywords" content="關(guān)鍵字，關(guān)鍵詞"/>
以上兩個meta都是為了SEO優(yōu)化 <title>頁面的標(biāo)題</title>
- body
- 標(biāo)題
<h1></h1><h2></h2> - 段落 p:雖然p是塊元素赛惩，但是他里面放的也是圖片躏碳，文字搞旭；
- span:里面用來放文本：圖片，文字菇绵；
- a鏈接
<a href="要跳往的地址"></a> - 圖片
<img src="相對地址/絕對地址"
- 標(biāo)題
- head
- css樣式肄渗，寫在<style></style>
- 樣式的基本語法：
選擇器(div){
key:value
}
p{ height:40px; line-height:40px; background-color:red; }- 選擇器：
- 標(biāo)簽選擇器：div,h,p,a,img,span
- class選擇器:.xinxi
(千萬不要用漢字和數(shù)字開頭做為class名，一定要用英文)
- 樣式的基本語法：
2. html更多解讀
- html只考慮標(biāo)簽嵌套咬最，跟tab和空格無關(guān)翎嫡，無數(shù)個空格，也只算作一個丹诀；
- 圖片標(biāo)簽
- 相對路徑：以當(dāng)前頁面為出發(fā)點(diǎn)查找的钝的；(./ 或 不寫,找到父級../)
- 絕對路徑：都是以http開頭的；例如：http://i1.piimg.com/567571/f3f79e8903424ea4.jpg
- 圖片標(biāo)簽上有兩個常用屬性铆遭，src屬性：引入圖片地址; alt標(biāo)簽：圖片無法正常加載時(shí)硝桩，用來替代的文字；(alt也可以省略)
- a鏈接
a鏈接有三個常用的屬性：- href:'要跳往的地址',href的作用
- 可以填寫絕對路徑枚荣，跳到直到的網(wǎng)頁
- 可以寫#：1）不確定地址的時(shí)候 2)簡單的回到頂部效果
- 利用錨點(diǎn)進(jìn)行頁面切換
- title:鼠標(biāo)以上時(shí)的提示
- target:打開方式(默認(rèn)的_self當(dāng)前頁面打開; _blank新頁面打開)
- 這些屬性中碗脊，title和target都可以省略；
- a鏈接的錨點(diǎn)使用
- 本頁面各個模塊之間的相互跳轉(zhuǎn)
<div id="#div1"></div> <a href="#div1"></a>- 實(shí)現(xiàn)不同頁面之間橄妆，不同模塊的相互跳轉(zhuǎn)
<a href="detail.html#detail1"></a>
3. 列表
- 無序列表:無序列表中的li也是容器衙伶；
<ul>
<li></li>
<li></li>
</ul>
- 有序列表
<ol>
<li></li>
<li></li>
</ol>
- 定義列表：dl,dt,dd都是容器
<dl>
<dt>表頭</dt>
<dd>詳情介紹</dd>
</dl>
4. 表單
- 表單用<from action="提交到哪里"></from>
- 輸入文本框
<input type="text" placeholder="默認(rèn)提示"/> - 輸入密碼
<input type="password" placeholder="默認(rèn)提示"/> - 單選按鈕：單選按鈕組，一定要加上name害碾，否則無法實(shí)現(xiàn)單選效果矢劲；
<input type="radio" name="sex"/>男
<input type="radio" name="sex"/>女
- 多選框
<input type="checkbox" checked/> - 下拉單
<select>
<option name="city" value="bj">北京</option>
<option name="city" value="sh">上海</option>
<option name="city" value="sz">深圳</option>
<select>
- name和value主要用于前端向后臺提交數(shù)據(jù)；id：1）設(shè)置樣式(不建議) 2)在JS階段慌随，用來獲取元素 3)id配合a鏈接芬沉，進(jìn)行錨點(diǎn)設(shè)置躺同；
- 留言框
<textarea name="" value="" cols="" rows=""></textarea> - 按鈕
- 普通按鈕 type=button
- 提交按鈕 type=submit
- 重置按鈕 type=reset
5. 選擇器
- 標(biāo)簽選擇器：div h1~h6 p span a img ul li ol dl dt dd input select
