一.< img/>圖片標簽
- 格式：
<img width="60%" src="xxx.jpg" alt="圖片替代文案"/>
-
作用：
<img/>用于告訴瀏覽器向網頁中嵌入一幅圖像。 - 常用屬性：
| 屬性 | 作用 |
|---|---|
src屬性 |
用于規(guī)定顯示圖像的 URL |
alt屬性 |
用于規(guī)定圖像的替代文本，即用于告訴瀏覽器當需要顯示的圖片找不到時顯示什么內容 |
title屬性 |
用于告訴瀏覽器鼠標懸停在圖片上時在彈出的描述框中顯示什么內容 |
width/height屬性 |
定義圖片的寬高 |
-
注意點：
1.<img/>圖片標簽必須包含src屬性和alt屬性。
2.src的url地址既可以是一個網絡地址也可以是一個本地路徑地址。
3.當我們沒有設置<img/>圖片標簽的width/height屬性時系統(tǒng)使用圖片默認大小。若設置了width/height屬性則可以改變圖片的寬高大小，但有可能會讓圖片變形，所以此時我們只需要選擇設置width/height屬性其中一個的值，則可以讓圖片等比放大或縮小且不會變形。
4.width/height屬性取值既可以是像素值也可以是相對于父容器的百分比。 -
title 和 alt的區(qū)別
1.title屬性用于鼠標懸停在元素上時顯示的提示信息，alt用于圖像無法顯示時，顯示在瀏覽器上的替代文本。
2.title既可以用于<a>標簽也可用于<img><p>等。而alt只能用于<img>標簽。
二.< a>超鏈接標簽
- 格式：
<a target="_blank" >百度</a>
-
作用：
<a>標簽定義超鏈接，用于從一張頁面鏈接到另一張頁面。 - 常用屬性：
| 屬性 | 作用 |
|---|---|
href屬性 |
規(guī)定鏈接指向的頁面的 URL |
target屬性 |
規(guī)定在何處打開鏈接文檔 |
title屬性 |
用于告訴瀏覽器鼠標懸停在鏈接上時在彈出的描述框中顯示什么內容 |
- target屬性取值
| target取值： | 作用 |
|---|---|
| _self | 默認，目標地址在當前選項卡打開，替換當前頁面。 |
| _blank | 目標地址在新的選項卡打開。 |
| _parent | 目標地址在在父框架中打開。 |
| _top | 目標地址在在最頂層打開。 |
| framename | 目標地址在在新窗口打開。 |
-
注意點：
1.開始標簽與結束標簽之間是超鏈接顯示給用戶的信息，既可以是文字也可以是圖片，所以用戶既可以通過點擊文字鏈接也可以通過點擊圖片跳轉界面。
2.一個< a>標簽必須要有一個href屬性。否則鏈接不知道跳轉到什么地方。href屬性的取值既可以是一個網絡地址，也可以是一個本地地址。
3.< a>標簽中的title屬性與<img/>圖片標簽中的title屬性一樣，也是用來當鼠標懸停在連接上時顯示提示文件信息。
三.與< a>標簽相關的< base>標簽
- 格式：
<head>
<base target="_blank" />
<base href="http://www.baidu.com /">
</head>
-
作用：
專門用來統(tǒng)一為頁面上的所有鏈接規(guī)定默認地址或默認目標。 -
注意點：
1.< base>標簽必須寫在< head>標簽中。
2.< base>標簽可以指定包括< a>、< img>、< link>、< form>標簽中的 URL。
3.若超鏈接需要跳轉的要求不同，則可在該鏈接< a>標簽中單獨設置屬性。瀏覽器會優(yōu)先按照< a>標簽指定執(zhí)行。
四.假鏈接
-
定義
點擊之后不會跳轉的鏈接我們稱其為假鏈接。 -
格式：
點擊后跳轉到頁面頂部：
<a href="#">點擊回到頂部</a>
點擊后不會跳轉：
<a href="javascript:">點擊無反應</a>
-
作用：
1.一個頁面過長時底部設置空標簽可直接回到頁面頂部。
2.在企業(yè)開發(fā)前期，我們編寫HTML代碼時可能其它頁面還沒有寫出來，這時網頁中的超鏈接我們就不會知道它要跳轉到哪個地方，所以只能用假鏈接暫時代替。等其它頁面完成時，再把假鏈接換成真鏈接。
五.錨點
-
定義：
錨點是網頁制作中超級鏈接的一種，又叫錨記。錨記像一個迅速定位器一樣是一種頁面內的超級鏈接，運用相當普遍。 -
格式：
跳轉到當前頁面指定位置：
<h2 id="center">本頁面的h2標題</h2>
<a href="#center">跳轉到本頁面的h2標題處</a>
跳轉到其它頁面指定位置：
<h2 id="end">123.html頁面的h2標題</h2>
<a href="123.html#end" target="_blank">跳轉到123.html頁面的h2標題處</a>
-
作用：
當一個頁面太長，文本信息量非常大時，我們有時需要在頁面前面把頁面中所有段落的目錄單獨列出來做成鏈接方便用戶查看。此時用戶就可以點擊目錄鏈接直接跳轉到鏈接相對應的文本處。 -
注意點：
1.由于我們需要跳轉的目標位置標簽屬性都一樣，比如都是用<h2>標簽包裹的標題。這時我們需要給跳轉目標標簽設置一個id名，然后才能在鏈接中的href屬性取值中加入對應的id名，這樣才能準確的跳轉。
2.< a>標簽既可以跳轉到當前頁面的指定位置，也可以跳轉到其它頁面的制定位置。通過設置target屬性可以選擇在本選項卡跳轉，也可以選擇在新的選項卡跳轉。
3.錨點的跳轉都是直接跳轉，中間無漸變屬性（頁面的滾動過程）。
六.src與href有什么區(qū)別
-
src屬性：
1.src是source的縮寫，指向外部資源的位置，指向的內容將會嵌入到文檔中當前標簽所在的位置。在請求src資源時會將其指向的資源下載并應用到文檔中。如js腳本、img圖片和frame等元素。
2.例如：<script src=".js"></script>當瀏覽器解析到該元素時，會暫停其他資源的下載和處理，直到該元素加載、編譯和執(zhí)行結束。因此js腳本應放在底部而非頭部。 -
href屬性：
1.href是hypertext reference的縮寫。指向網絡資源所在的位置。用于在當前文檔與引用資源之間確立聯系。
2.例如:<link href=".css" rel="stylesheet"/>瀏覽器會識別該文件是css文件，就會并行下載資源并且不會停止對當前文檔的處理。
注：本段內容出處鏈接
七.< iframe>標簽
- 格式
插入另一個html文件
<iframe src="page.html"></iframe>
當前頁面插入百度
<iframe src="http://www.baidu.com" name="myPage"></iframe>
點擊鏈接會在當前頁面顯示W3C網站
<p><a target="myPage">W3C</a></p>
-
作用
iframe元素會創(chuàng)建包含另外一個文檔的內聯框架（即行內框架）。就是在一個頁面中嵌入另一個網頁。
八.引入文件的路徑問題
-
路徑問題的產生
當我們使用src屬性和href屬性給當前的HTML文件引入文件時，有時使用的是被引入目標文件的網絡地址URL，此時只需要給src屬性和href屬性添加該文件的網絡地址即可，但有時我們也需要引入本地文件，那么怎么給src屬性和href屬性賦值，這就出現了路徑問題。一般情況下引入本地目標文件的地址有以下兩種方式： -
相對路徑與絕對路徑
相對路徑賦值：
1.同級
目標文件與HTML文件處于同一個文件夾，二者是同級關系。用./目標文件名表示當前目錄，或者直接省略./也可。
格式：
<a href="./目標文件名">文本</a> 或 <a href="目標文件名">文本</a>
<img src="./目標文件名" /> 或 <img src="目標文件名" />
2.下級
目標文件所在的文件夾與HTML文件處于同一個文件夾，目標文件就是HTML文件的下級關系。用目標文件夾名/目標文件名表示。若目標文件藏的比較深在下下級，則文件夾的名字可以一直往下延伸到找到目標文件為止。
格式：
<a href="目標文件夾名/目標文件名">文本</a>
<img src="目標文件夾名/目標文件名" />
3.上級
目標文件與HTML文件所在的文件夾處于同一個文件夾，目標文件就是HTML文件的上級關系。用../目標文件名表示。以此類推若是上上級就是../../目標文件名
格式：
<a href="../../目標文件名">文本</a>
<img src="../../目標文件名" />
4.上下級搭配使用
例如目標文件所在的文件夾在HTML文件的上上級，則我們可以先通過../../找到目標文件所在的文件夾，然后再通過下級目標文件夾名/目標文件名找到目標文件。
格式：
<a href="../../目標文件夾名/目標文件名">文本</a>
<img src="../../目標文件夾名/目標文件名" />
絕對對路徑賦值：
直接從指定的盤符開始查找一直找到目標文件。用/表示當前磁盤根目錄
格式：
<a href="/目標文件名">文本</a>
<img src="/目標文件名" />
-
注意點：
1.路徑中盡量不要出現中文。即文件夾的名字盡量不要使用中文，因為可能會照成不可預知的問題。
2.用斜杠符號/時盡量統(tǒng)一標準用/，不要使用\.反斜杠。因為開發(fā)中代碼可能會放到服務器上，而服務器統(tǒng)一標準都用的/。
3.一般在開發(fā)中路徑使用最多的是相對路徑中的同級或下級。絕對路徑幾乎不會用到。因為絕對路徑的可移植性不好，如代碼需要換個地方儲存時，利用當前磁盤來賦值的絕對路徑就會失效。
4.不能夸盤符查找目標文件。
