第五節(jié) 圖片標簽
圖片標簽，又叫做貼圖標簽。是制作網(wǎng)頁的一種基本標簽。圖片標簽，沒有尾標簽。
圖片標簽解析：<圖片標簽 路徑＝“地址” 寬度＝450 高度＝673>
圖片的路徑，是指圖片保存在哪個網(wǎng)站的服務器中，也就是指圖片的地址。
圖片標簽中，還可以添加許多屬性與屬值：
title屬性：標題。在等號后面的雙引號內輸入標題內容，當用鼠標箭頭指向圖片的時候，就會顯示出這些文字。例如：title="東方女性之魅力"。當用鼠標箭頭指向圖片的時候，就會顯示出“東方女性之魅力”這些文字。
標題的文字內容，可以是對圖片的描述，也可以是你的空間的名稱等內容。
alt屬性：替代文本。alt屬性的作用是：當圖片無法顯示的時候，就會顯示出這里的文字內容。
例1：alt="“春天沒來”歡迎您" 。當圖片無法顯示的時候，就會顯示出“春天沒來”歡迎您的文字內容，說明這個圖片來自“春天沒來”的圖書館。
例2：alt="東方女性美美美"。當圖片無法顯示的時候，就會顯示出東方女性美美美的文字內容，說明這個圖片是美女圖片。
添加了標題屬性與替代文本屬性的圖片標簽：
圖片標簽還可以添加邊框線的屬性：
<IMG style="BORDER-BOTTOM: rgb(153,153,153) 4px solid; BORDER-LEFT: rgb(153,153,153) 4px solid; BORDER-TOP: rgb(153,153,153) 4px solid; BORDER-RIGHT: rgb(153,153,153) 4px solid" src=" 上面的圖片標簽中添加了寬度為4px的灰色的實線型邊框線。要修改邊框線的顏色，你就修改上面標簽中括號內的數(shù)值；要修改邊框線的寬度，你就修改“4px”中的“4”；要修改邊框線的樣式，你就替換solid代碼。
邊框線的樣式如下：dotted是點虛線型；dashed是線虛線型；solid是實線型；double是雙線型；groove是3D溝槽狀；ridge是3D脊狀；inset是3D內嵌式；outset是3D外嵌式。（邊框線的設置方法，我將在“表格標簽”一節(jié)中詳細講解。）
圖片標簽還可以添加對齊方式屬性： （DISPLAY: block屬性不可省略）
<IMG style="TEXT-ALIGN: center; DISPLAY: block" alt="" src=" 你看看效果吧，圖片是不是居中顯示的？（對齊方式，我在以后的相關教程中詳細講解。）
圖片標簽還可以添加自定義鼠標指針樣式：
你看看效果吧，圖片中是不是有了漂亮的光標了？（這種效果，可能有的瀏覽器不支持。）
圖片標簽還可以添加外邊矩屬性：
<IMG style="BORDER-RIGHT-WIDTH: 0px; MARGIN: 20px; WIDTH: 450px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" src=" 圖片標簽添加了外邊矩屬性，會在圖片外圍的四周留出一定的空白部位。也可以設置為在圖片外圍的某一邊留出一定的空白部位（外邊矩屬性，我在以后的相關教程中詳細講解。）。
圖片標簽還可以添加css的絕對定位樣式或者相對定位樣式，添加了這些屬性，可以將圖片放置到你想放置的任意地方：
<IMG style="POSITION: absolute; WIDTH: 450px; TOP: 1200px; LEFT: 0px" alt="" src=" 上面的圖片標簽添加了css的絕對定位樣式，要添加css的相對定位樣式，把absolute修改為 relative即可。
你看看這個圖片，是不是放置到網(wǎng)頁下方很遠的地方了？需要向下拖動豎向滾動條才可以看到歐！
css的絕對定位樣式與相對定位樣式，我將單獨撰寫一節(jié)教程專題講解。
圖片標簽可以添加的屬性還有很多很多，等到你代碼入門以后，自己再研究探討吧。
要想應用圖片標簽，你還得學會尋找圖片的地址。
尋找圖片地址的方法如下：
例如這個圖片：
如下圖：
在制作網(wǎng)頁時，我們常常要修改圖片的大小。修改圖片的方法有好幾種，最簡單實用的方法就是在代碼中修改。在代碼中修改圖片的寬度值與高度值即可。
其寬度值是450，高度值是673。你只要修改這兩個數(shù)值，就可以把圖片變大或者變小。
作業(yè)：
1、認識圖片標簽的一般表達方式，弄清楚圖片屬性：路徑、寬度、高度的含義。
2、會在圖片標簽中修改圖片的規(guī)格，會在圖片標簽中替換圖片的地址。
3、認識圖片的“標題”屬性、“替代文本”屬性、“邊框線”屬性、“對齊方式”屬性、“外邊矩”屬性，并學會應用這些屬性。
4、試著給圖片添加一個自定義鼠標指針。自定義鼠標指針，見我整理的這些文章：
添加方法：用這些文章中的“鼠標特效代碼”替換上面講解的“添加了自定義鼠標指針樣式的圖片標簽”中“括號內的鼠標地址”。
5、試著給圖片添加絕對定位樣式，觀察其顯示效果。
6、試著給圖片添加相對定位樣式，觀察其顯示效果。
“春天沒來”編撰
2014年4月2日于北京
