課程來自慕客網(wǎng)：http://www.imooc.com/code/49
另外有網(wǎng)易coursera合作的課程：網(wǎng)絡(luò)技巧 - 網(wǎng)絡(luò)技術(shù)和HTML5簡介
提前準(zhǔn)備：安裝Dreamweaver 6
點(diǎn)擊安裝Dreamweaver 6?親測(cè)破解版可用无埃，算是這兩天最大的收獲了买优。
注意：安裝中自己碰到了兩個(gè)問題,解決辦法如下：
1-安裝到一半提示需要重啟電腦。
? ? 原因：之前安裝不成功留下了記錄
解決辦法：進(jìn)入注冊(cè)表刪除注冊(cè)不成功記錄
2-安裝提示連接不上網(wǎng)絡(luò)
? ? 原因：不知
? ? 解決辦法：先斷網(wǎng)坦辟，然后再運(yùn)行安裝熄浓。（坑爹啊糜芳，連著網(wǎng)的時(shí)候提示連接不上網(wǎng)絡(luò)鲁纠；斷網(wǎng)之后，反而安裝成功了）
2015-1-20 學(xué)習(xí)筆記
1-1:代碼初體驗(yàn)
1-2：html 和 CSS的關(guān)系：內(nèi)容和表達(dá)形式的關(guān)系
1-3&1-4: 標(biāo)簽以及標(biāo)簽的寫法
1-5：html 語言的基本結(jié)構(gòu)：
? ? ? ? <html>
? ? ? ? ?<head></head>
? ? ? ? ? <body></body>
? ? ? ? </html>
1-6：文檔頭：<head></head>,包含文檔的基本信息运提，如title等蝗柔，但一般不會(huì)展示給用戶看。
1-7：代碼注釋方式：<!--注釋文字-->
2-1:語義化
2-2：容納具體網(wǎng)站內(nèi)容的標(biāo)簽:<body></body>
2-3：分段標(biāo)簽：<p></p>
2-4：字體大胁谵唷：<h1></h1>-><h6></h6>
2-5: <em>這是斜體</em>诫咱；<strong>這是加粗</strong>
2-6:用span設(shè)置文本格式：
? ? a-先設(shè)定span的意思：比如“藍(lán)色”
? ? ? <style>
? ? ? ? ? ? ? ? ? <span>color:blue;</span>
? ? ? ?</style>
? ? ? ? b-指定應(yīng)用范圍： <span>文本</span>
2-7:一句話的引用：<q></q>
2-8：長段文章引用：<blockquote></blockquote>
2-9:使用</br>標(biāo)簽分行顯示文本
2-10:添加空格：
2-11: 加入分隔線： <hr> 或者 <hr/>, 空標(biāo)簽
2-12: 加入地址標(biāo)簽（變斜體）：<address></address>
2-13: 加入一句代碼標(biāo)簽： <code></code>
2-14:保留原文本格式（加入大段代碼）標(biāo)簽：
? ? ? ? ?<pre></pre>
3-1:信息列表: <ul>
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?<li></li>
? ? ? ? ? ? ? ? ? ? ? ?</ul>
3-2:ol 有序信息列表： <ol>
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? <li></li>
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?</ol>
3-3:<div></div> 邏輯板塊分類（division)
3-4：給DIV命名<div id=xxx></div>
2015-1-21 學(xué)習(xí)筆記
3-5表格標(biāo)簽：
? ? ?<table>
? ? ?<--!以下是表頭,一般表頭默認(rèn)為一行笙隙，由任意個(gè)表格組成-->
? ? ?<th>
? ? ?<td>這是表格<td>
? ? ?</th>
? ? ? <--!以下是表格內(nèi)容洪灯，默認(rèn)為一行，由任意個(gè)表格組成-->
? ? ? <tr><td>內(nèi)容</td></tr>
? ? ? </table>
3-6 用CSS樣式竟痰，為表格添加邊框
? ? ?<style type="style/css">
? ? ? table,tr,td,th{border:1px,solid,#000;}
? ? ? </style>
3-7:表格摘要及標(biāo)題：
? ? ? <table summary="摘要內(nèi)容">
? ? ? <caption>標(biāo)題</caption>
4-1:認(rèn)識(shí)<a>標(biāo)簽签钩，鏈接到另外一個(gè)頁面，默認(rèn)為在原有瀏覽器打開
? ? ? ?<a href="鏈接" title="鼠標(biāo)滑過顯示的文本">展示的文本</a>
比如：<a href="http://xxx" title="學(xué)習(xí)網(wǎng)站">點(diǎn)擊這里</a>
4-2: 在新建瀏覽器打開頁面：目標(biāo)網(wǎng)址后+ target="_blank"
4-3：使用mailto 發(fā)送郵件坏快，更多詳細(xì)說明點(diǎn)擊這里
<a href="mailto:xx@xx.com?cc=xx@xx.com&bcc=xx@xx.com&subject=文本內(nèi)容&body=文本內(nèi)容></a>
4-4:插入圖片
<img src="圖片地址" alt="下載失敗時(shí)的替換文本" title = "提示文本">
1-22 學(xué)習(xí)筆記
5-1 表單文件
<form method=“傳送方式” action="服務(wù)器文件" ></form>
舉例：
<form method="post"? action="save.php">
? ? ? ? <label for="username">用戶名:</label>
? ? ? ? <input type="text" name="username" />?
?? ? ? <label for="pass">密碼:</label>? ? ? ? <input type="password" name="pass"/></form>
5-2 文本輸入框 密碼輸入框
<form>
? ? ? ? ? ? ?<input type="text/password" name="名稱” value="文本"/>
</form>
當(dāng)type="text"時(shí)铅檩，輸入框?yàn)槲谋据斎肟?當(dāng)type="password"時(shí)，輸入框?yàn)槊艽a輸入框莽鸿。
5-3 文本域昧旨，支持多行文本輸入
<textarea rows="行數(shù)" cols="列數(shù)">文本</textarea>
5-4 單選框拾给，復(fù)選框
<input type="radio/checkbox" value="值" name="名稱" checked="checked"/>
? ? 1、type:
? ? ? 當(dāng)type="radio"時(shí)兔沃，控件為單選框.name取值一定要一致蒋得，這樣才能起到單選作用。
? ? ? 當(dāng)type="checkbox"時(shí)乒疏，控件為復(fù)選框
? ? 2额衙、value：提交數(shù)據(jù)到服務(wù)器的值（后臺(tái)程序PHP使用）
? ? 3、name：為控件命名怕吴，以備后臺(tái)程序ASP窍侧、PHP使用
? ? 4、checked：當(dāng)設(shè)置checked="checked"時(shí)转绷，該選項(xiàng)被默認(rèn)選中
5-5 使用下拉表框進(jìn)行單選伟件，節(jié)省空間
<select>
<option value="提交值">選項(xiàng)</option>
</select>
selected 屬性為默認(rèn)選擇，使用方法：selected="selected".
5-6 使用下拉表框進(jìn)行多選
在<select>標(biāo)簽中設(shè)置 multiple="multiple"屬性议经，就可以實(shí)現(xiàn)多選功能锋爪。size="2", size為顯示出來的選項(xiàng)數(shù)。
5-7 使用提交鈕爸业，提交數(shù)據(jù)
<input type="submit" value="提交">
5-8 使用重置按鈕其骄，重置表單信息
<input type="reset" value="重置">
5-9 form表單中的label標(biāo)簽
<label for="空間id名稱">, 標(biāo)簽的for屬性中的值應(yīng)當(dāng)與相關(guān)控件的id相同。
1-23 學(xué)習(xí)日志
6-1: 認(rèn)識(shí)CSS
CSS全稱為“層疊樣式表 (Cascading Style Sheets)”扯旷，它主要是用于定義HTML內(nèi)容在瀏覽器內(nèi)的顯示樣式拯爽，如文字大小、顏色钧忽、字體加粗等毯炮。
6-2:CSS的優(yōu)勢(shì)
為什么使用css樣式來設(shè)置網(wǎng)頁的外觀樣式呢？右邊編輯器是一段文字耸黑，我們想把“超酷的互聯(lián)網(wǎng)”桃煎、“服務(wù)及時(shí)貼心”、“有趣易學(xué)”這三個(gè)短語的文本顏色設(shè)置為紅色大刊，這時(shí)就 可以通過設(shè)置樣式來設(shè)置为迈，而且只需要編寫一條css樣式語句。
第一步：把這三個(gè)短語用<span></span>括起來缺菌。（見右邊代碼編輯器13行）
第二步：寫入下列代碼：span{ color:red;}
6-3:CSS語法
css 樣式由選擇符和聲明組成葫辐，而聲明又由屬性和值組成。如圖所示伴郁。
聲明：在英文大括號(hào)“｛｝”中的的就是聲明耿战，屬性和值之間用英文冒號(hào)“：”分隔。當(dāng)有多條聲明時(shí)焊傅，中間可以英文分號(hào)“;”分隔剂陡，如下所示：
p{color:blue;fontsize:12px;
6-4: 注釋代碼 /*文字內(nèi)容*/
7-1內(nèi)聯(lián)式：
<p style="color:red">這里文字是紅色狈涮。</p>
7-2嵌入式：嵌入式css樣式，就是可以把css樣式代碼寫在<style type="text/css"></style>標(biāo)簽之間鸭栖。
7-3 外部式：
外部式css樣式(也可稱為外聯(lián)式)就是把css代碼寫一個(gè)單獨(dú)的外部文件中薯嗤，這個(gè)css樣式文件以“.css”為擴(kuò)展名，在<head>內(nèi)（不是在<style>標(biāo)簽內(nèi)）使用<link>標(biāo)簽將css樣式文件鏈接到HTML文件內(nèi)纤泵，如下面代碼：
<link href="base.css" rel="stylesheet" type="text/css" />
注意：
1骆姐、css樣式文件名稱以有意義的英文字母命名，如 main.css捏题。
2玻褪、rel="stylesheet" type="text/css" 是固定寫法不可修改。
3公荧、標(biāo)簽位置一般寫在標(biāo)簽之內(nèi)带射。
7-4 不同形式的優(yōu)先級(jí)：就近原則。一般：內(nèi)聯(lián)式 > 嵌入式 > 外部式
8-1 選擇器
每一條css樣式聲明（定義）由兩部分組成：選擇器{樣式}
在{}之前的部分就是“選擇器”循狰，“選擇器”指明了{(lán)}中的“樣式”的作用對(duì)象窟社，也就是“樣式”作用于網(wǎng)頁中的哪些元素。
8-2 標(biāo)簽選擇器
標(biāo)簽選擇器其實(shí)就是html代碼中的標(biāo)簽绪钥。如右側(cè)代碼編輯器中的<html>灿里、<body>、<h1>程腹、<p>匣吊、<img>。
8-3 類選擇器
.類選器名稱{css樣式代碼;
步驟：
第一步：使用合適的標(biāo)簽把要修飾的內(nèi)容標(biāo)記起來：<span>膽小如鼠</span>
第二步：使用class="類選擇器名稱"為標(biāo)簽設(shè)置一個(gè)類寸潦，如下：<span class="stress">膽小如鼠</span>
第三步：設(shè)置類選器css樣式色鸳，如下：.stress{color:red;}/*類前面要加入一個(gè)英文圓點(diǎn)*/
8-4 ID選擇器
在很多方面，ID選擇器都類似于類選擇符见转，但也有一些重要的區(qū)別：
1命雀、為標(biāo)簽設(shè)置id="ID名稱"，而不是class="類名稱"斩箫。
2吏砂、ID選擇符的前面是井號(hào)（#）號(hào)，而不是英文圓點(diǎn)（.）校焦。
8-5 ID選擇器和類選擇器的比較
相同點(diǎn)：可以應(yīng)用于任何元素
不同點(diǎn)：
1赊抖、ID選擇器只能在文檔中使用一次。與類選擇器不同寨典，在一個(gè)HTML文檔中，ID選擇器只能使用一次房匆，而且僅一次耸成。而類選擇器可以使用多次报亩。
2、可以使用類選擇器詞列表方法為一個(gè)元素同時(shí)設(shè)置多個(gè)樣式井氢。我們可以為一個(gè)元素同時(shí)設(shè)多個(gè)樣式弦追，但只可以用類選擇器的方法實(shí)現(xiàn)，ID選擇器是不可以的（不能使用 ID 詞列表）花竞。
8-6 子選擇器
還有一個(gè)比較有用的選擇器子選擇器劲件，即大于符號(hào)(>),用于選擇指定標(biāo)簽元素的第一代子元素。
.food>li{border:1px solid red;}
這行代碼會(huì)使class名為food下的子元素li（水果约急、蔬菜）加入紅色實(shí)線邊框零远。
8-7 包含(后代)選擇器
.first? span{color:red;}
和子選擇器的差別：包含所有后代，子選擇器只包含直接后代厌蔽。
8-8 通用選擇器
通用選擇器是功能最強(qiáng)大的選擇器牵辣，它使用一個(gè)（*）號(hào)指定，它的作用是匹配html中所有標(biāo)簽元素奴饮，
8-9 偽類選擇符
a:hover{color:red;}
8-9 分組選擇符
.first,#second span{color:green;}
9-1,9-2
各類標(biāo)簽符號(hào)的權(quán)值：權(quán)值越高纬向，對(duì)指定文本的控制度越高。
p{color:red;}/*權(quán)值為1*/
p span{color:green;}/*權(quán)值為1+1=2*/
.warning{color:white;}/*權(quán)值為10*/
p span.warning{color:purple;}/*權(quán)值為1+1+10=12*/
#footer .note p{color:yellow;}/*權(quán)值為100+10+1=111*/
9-3 CSS的層疊：就近原則
9-4 重要性：
p{color:red!important;}
p{color:green;}
<p class="first">三年級(jí)時(shí)戴卜，我還是一個(gè)<span>膽小如鼠</span>的小女孩逾条。</p>
10-1 字體
body{font-family:"宋體";}
10-2 文字排版--字號(hào)、顏色
body{font-size:12px;color:#666}
10-3,4 文字排版--粗體,斜體,下劃線,刪除線
p span{font-weight:bold;}
p a{font-style:italic;}
p a{text-decoration:underline;}
.oldPrice{text-decoration:line-through;}
10-7 段落排版 縮進(jìn)
p{text-indent:2em;}
10-8 段落排版--行間距（行高）
p{line-height:1.5em;}
10-9 段落排版--字間距投剥、字母間距
如果想在網(wǎng)頁排版中設(shè)置文字間隔或者字母間隔就可以使用letter-spacing來實(shí)現(xiàn).
如果我想設(shè)置英文單詞之間的間距呢膳帕？可以使用word-spacing來實(shí)現(xiàn)。
10-10 段落排版--對(duì)齊
想為塊狀元素中的文本薇缅、圖片設(shè)置居中樣式嗎危彩？可以使用text-align樣式代碼，如下代碼可實(shí)現(xiàn)文本居中顯示泳桦。
text-align:center;
text-align:left;
text-align:right;
11-1 元素分類
在講解CSS布局之前汤徽，我們需要提前知道一些知識(shí)，在CSS中灸撰，html中的標(biāo)簽元素大體被分為三種不同的類型：塊狀元素谒府、內(nèi)聯(lián)元素(又叫行內(nèi)元素)和內(nèi)聯(lián)塊狀元素。
常用的塊狀元素有：
<div>浮毯、<p>完疫、<h1>...<h6>、<ol>债蓝、<ul>壳鹤、<dl>、<table>饰迹、<address>芳誓、<blockquote> 余舶、<form>
常用的內(nèi)聯(lián)元素有：
<a>、<span>锹淌、<br>匿值、<i>、<em>赂摆、<strong>挟憔、<label>、<q>烟号、<var>绊谭、<cite>、<code>
常用的內(nèi)聯(lián)塊狀元素有：
<img><input>
11-2 元素分類--塊級(jí)元素
在html中<div>褥符、 <p>龙誊、<h1>、<form>喷楣、<ul> 和 <li>就是塊級(jí)元素趟大。設(shè)置<display:block>就是將元素顯示為塊級(jí)元素。
塊級(jí)元素特點(diǎn)：
1铣焊、每個(gè)塊級(jí)元素都從新的一行開始逊朽，并且其后的元素也另起一行。（真霸道曲伊，一個(gè)塊級(jí)元素獨(dú)占一行）
2叽讳、元素的高度、寬度坟募、行高以及頂和底邊距都可設(shè)置岛蚤。
3、元素寬度在不設(shè)置的情況下懈糯，是它本身父容器的100%（和父元素的寬度一致）涤妒，除非設(shè)定一個(gè)寬度。
11-3 內(nèi)聯(lián)元素
在html中赚哗，<span>她紫、<a>、<label>屿储、<input>贿讹、 <img>、 <strong> 和<em>就是典型的內(nèi)聯(lián)元素（行內(nèi)元素）（inline）元素够掠。當(dāng)然塊狀元素也可以通過代碼display:inline將元素設(shè)置為內(nèi)聯(lián)元素民褂。如下代碼就是將塊狀元素div轉(zhuǎn)換為內(nèi)聯(lián)元素，從頁使用div元素具有內(nèi)聯(lián)元素特點(diǎn)。
內(nèi)聯(lián)元素特點(diǎn)：
1助赞、和其他元素都在一行上买羞；
2袁勺、元素的高度雹食、寬度、行高及頂部和底部邊距不可設(shè)置期丰；
3群叶、元素的寬度就是它包含的文字或圖片的寬度，不可改變钝荡。
11-4 元素分類--內(nèi)聯(lián)塊狀元素
內(nèi)聯(lián)塊狀元素（inline-block）就是同時(shí)具備內(nèi)聯(lián)元素街立、塊狀元素的特點(diǎn)，代碼display:inline-block就是將元素設(shè)置為內(nèi)聯(lián)塊狀元素埠通。(css2.1新增)赎离，<img>、<input>標(biāo)簽就是這種內(nèi)聯(lián)塊狀標(biāo)簽端辱。
inline-block元素特點(diǎn)：
1梁剔、和其他元素都在一行上；
2舞蔽、元素的高度荣病、寬度、行高以及頂和底邊距都可設(shè)置渗柿。
11-5 盒子模型（視頻）
margin, padding,border
11-6 盒子模型（邊框）
盒子模型的邊框就是圍繞著內(nèi)容及補(bǔ)白的線个盆，這條線你可以設(shè)置它的粗細(xì)、樣式和顏色(邊框三個(gè)屬性)朵栖。
注意：
1颊亮、border-style（邊框樣式）常見樣式有：
dashed（虛線）| dotted（點(diǎn)線）| solid（實(shí)線）。
2陨溅、border-color（邊框顏色）中的顏色可設(shè)置為十六進(jìn)制顏色终惑，如:border-color:#888;//前面的井號(hào)不要忘掉。
3声登、border-width（邊框?qū)挾龋┲械膶挾纫部梢栽O(shè)置為：
thin | medium | thick（但不是很常用）狠鸳，最常還是用象素（px）。
例子：p{border:2px dotted #ccc;}
11-7 盒子模型 邊框（二）
現(xiàn)在有一個(gè)問題悯嗓，如果有想為p標(biāo)簽單獨(dú)設(shè)置下邊框件舵，而其它三邊都不設(shè)置邊框樣式怎么辦呢？css樣式中允許只為一個(gè)方向的邊框設(shè)置樣式：div{border-bottom:1px solid red;}
也可以 border-right, border-left, border top.
11-8 盒模型--寬度和高度
盒模型寬度和高度和我們平常所說的物體的寬度和高度理解是不一樣的脯厨，css內(nèi)定義的寬（width）和高（height）铅祸，指的是填充以里的內(nèi)容范圍。
因此一個(gè)元素實(shí)際寬度（盒子的寬度）=左邊界+左邊框+左填充+內(nèi)容寬度+右填充+右邊框+右邊界。見圖临梗。
11-9 盒模型--填充
元素內(nèi)容與邊框之間是可以設(shè)置距離的涡扼，稱之為“填充”(padding)。填充也可分為上盟庞、右吃沪、下、左(順時(shí)針)什猖。如下代碼：
div{
padding-top:20px;
padding-right:10px;
padding-bottom:15px;
padding-left:30px;
}
11-10 盒模型--邊界
元素與其它元素之間的距離可以使用邊界（margin）來設(shè)置票彪。邊界也是可分為上、右不狮、下降铸、左。如下代碼：div{margin:20px 10px 15px 30px;}
12-1 css布局模型
CSS包含3種基本的布局模型摇零，用英文概括為：Flow推掸、Layer 和 Float。
在網(wǎng)頁中驻仅，元素有三種布局模型：
1谅畅、流動(dòng)模型（Flow）
2、浮動(dòng)模型 (Float)
3雾家、層模型（Layer）
12-2 流模型
流動(dòng)布局模型具有2個(gè)比較典型的特征：
第一點(diǎn)铃彰，塊狀元素都會(huì)在所處的包含元素內(nèi)自上而下按順序垂直延伸分布，因?yàn)樵谀J(rèn)狀態(tài)下芯咧，塊狀元素的寬度都為100%牙捉。實(shí)際上，塊狀元素都會(huì)以行的形式占據(jù)位置敬飒。如右側(cè)代碼編輯器中三個(gè)塊狀元素標(biāo)簽(div邪铲，h1，p)寬度顯示為100%无拗。
12-2 流模型（2）
第二點(diǎn)带到，在流動(dòng)模型下，內(nèi)聯(lián)元素都會(huì)在所處的包含元素內(nèi)從左到右水平分布顯示英染。（內(nèi)聯(lián)元素可不像塊狀元素這么霸道獨(dú)占一行）
右側(cè)代碼編輯器中內(nèi)聯(lián)元素標(biāo)簽a揽惹、span、em四康、strong都是內(nèi)聯(lián)元素搪搏。
12-3 浮動(dòng)模型
12-5 什么是層模型？
層布局模型就像是圖像軟件PhotoShop中非常流行的圖層編輯功能一樣闪金，每個(gè)圖層能夠精確定位操作疯溺，但在網(wǎng)頁設(shè)計(jì)領(lǐng)域论颅，由于網(wǎng)頁大小的活動(dòng)性，層布局沒能受到熱捧囱嫩。
層模型有三種形式：
1恃疯、絕對(duì)定位(position: absolute)
2、相對(duì)定位(position: relative)
3墨闲、固定定位(position: fixed)
12-6 絕對(duì)定位
如果想為元素設(shè)置層模型中的絕對(duì)定位今妄，需要設(shè)置position:absolute(表示絕對(duì)定位)，這條語句的作用將元素從文檔流中拖出來损俭，然后使用left蛙奖、right潘酗、top杆兵、bottom屬性相對(duì)于其最接近的一個(gè)具有定位屬性的父包含塊進(jìn)行絕對(duì)定位。如果不存在這樣的包含塊仔夺，則相對(duì)于body元素琐脏，即相對(duì)于瀏覽器窗口。
12-7 層模型--相對(duì)定位
如果想為元素設(shè)置層模型中的相對(duì)定位缸兔，需要設(shè)置position:relative（表示相對(duì)定位）日裙，它通過left、right惰蜜、top昂拂、bottom屬性確定元素在正常文檔流中的偏移位置。相對(duì)定位完成的過程是首先按static(float)方式生成一個(gè)元素(并且元素像層一樣浮動(dòng)了起來)抛猖，然后相對(duì)于以前的位置移動(dòng)格侯，移動(dòng)的方向和幅度由left、right财著、top联四、bottom屬性確定，偏移前的位置保留不動(dòng)撑教。
12-8 relative 和 absolute 的搭配使用
1. 被參照定位的元素一定要是參照定位元素的父元素朝墩。
? <div id="box1"><!--被參照定位的元素-->
<div id="box2">相對(duì)參照元素進(jìn)行定位</div><!--相對(duì)定位元素-->
2、被參照定位的元素必須加入position:relative;
3伟姐、參照定位的元素必須加入 position:absolute;
13-1 盒模型代碼簡寫
通常有下面三種縮寫方法:
1收苏、如果top、right愤兵、bottom鹿霸、left的值相同，寫一個(gè)恐似。如：margin:10px;
2杜跷、如果top和bottom值相同、left和 right的值相同，如下面代碼：margin:10px 20px;
3葛闷、如果left和right的值相同憋槐，如下面代碼：margin:10px 20px 30px;
13-2 顏色值縮寫
關(guān)于顏色的css樣式也是可以縮寫的，當(dāng)你設(shè)置的顏色是16進(jìn)制的色彩值時(shí)淑趾，如果每兩位的值相同阳仔，可以縮寫一半。
13-3 字體縮寫
body{
font-style:italic;
font-variant:small-caps;
font-weight:bold;
font-size:12px;
line-height:1.5em;
font-family:"宋體",sans-serif;
}
可以簡寫為：
body{
font:italic? small-caps? bold? 12px/1.5em? "宋體",sans-serif;
}
1扣泊、使用這一簡寫方式你至少要指定 font-size 和 font-family 屬性近范，其他的屬性(如 font-weight、font-style延蟹、font-varient评矩、line-height)如未指定將自動(dòng)使用默認(rèn)值。
2阱飘、在縮寫時(shí) font-size 與 line-height 中間要加入“/”斜扛斥杜。
W3school 練習(xí)
1-不帶下劃線的鏈接
<a href="地址" ?style="textdecoration:none">這是一個(gè)鏈接！</a>
2-外部樣式表
外部樣式表
當(dāng)樣式需要被應(yīng)用到很多頁面的時(shí)候沥匈，外部樣式表將是理想的選擇蔗喂。使用外部樣式表，你就可以通過更改一個(gè)文件來改變整個(gè)站點(diǎn)的外觀高帖。
3-內(nèi)部樣式表
內(nèi)部樣式表
當(dāng)單個(gè)文件需要特別樣式時(shí)缰儿，就可以使用內(nèi)部樣式表。你可以在 head 部分通過 <style> 標(biāo)簽定義內(nèi)部樣式表散址。
<head><style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style></head>
4-插入圖像作為超鏈接：
您也可以使用圖像來作鏈接：
<p>
<a href="鏈接">
<img src="">
</a>
</p>
我們通過使用 <a> 標(biāo)簽在 HTML 中創(chuàng)建鏈接乖阵。
有兩種使用 標(biāo)簽的方式：
通過使用 href 屬性 - 創(chuàng)建指向另一個(gè)文檔的鏈接
通過使用 name 屬性 - 創(chuàng)建文檔內(nèi)的書簽
5-設(shè)置圖像在文本中對(duì)齊
<img src="鏈接" align="bottom">, 還可以用 ?middle, top.
6-圖片浮動(dòng)
<img src="鏈接" align="left">, 還可以用 right
7-改變圖片大小
<img src="鏈接" width=100px height=100px>
8-無法顯示圖片時(shí)（比如由于瀏覽器不兼容），可以顯示替換文本
<img src="鏈接" alt="向左轉(zhuǎn)">
