關注問題
1人贊同了該回答
? 這一章我們來學習怎么樣在網(wǎng)頁中插入圖片，最重要的是學會圖片的相對路徑的用法，另外需要了解常用的圖片格式和特點。
1、HTML中圖片用img標簽引入，img是image的縮寫。img標簽有三個重要屬性需要掌握：src、alt和title，其中src是圖片的路徑，alt用于向探索引擎描述圖片，title用于向用戶描述圖片。img標簽的語法是：
從下面的例子中可以看到，當鼠標放在圖片上時，圖片上出現(xiàn)的文字就是title屬性里的內容，而alt的內容是看不見的。
當我們把src屬性中的地址刪掉，無法顯示圖片的時候，原來圖片的位置上就會出現(xiàn)alt屬性的內容了，如下圖：
2、絕對路徑
現(xiàn)在我的電腦上面有如下圖所示的文件系統(tǒng)，絕對路徑就是在計算機或服務器上的完整路徑，無論在哪個網(wǎng)頁上引用，路徑都是一樣的。代碼和效果如下：
注意這里的圖片名pic2.jpg包括擴展名。
3、相對路徑
相對路徑是指相對于當前頁面的位置，這句話不好理解，我們通過4種情況來說明。
?。?）網(wǎng)頁和圖片在同一個文件夾里，就是這里的page3和pic1的關系或者page2和pic2的關系。這種情況直接引用圖片的名稱就可以。
?。?）圖片在與網(wǎng)頁同級的文件夾里，就是這里的page2和pic1的關系，這里要用到pic1所在的文件夾名。
?。?）圖片在網(wǎng)頁的上級文件夾里，就像page1和pic2的關系，引用代碼如下：
注意這段代碼里的“..”表示的是上一級文件夾。誰的上一級文件夾？當前網(wǎng)頁的所在文件夾的上一級。所以"..pic2.jpg"的意思是“本網(wǎng)頁的上一級文件夾里的pic2.jpg圖片”。
?。?）圖片和網(wǎng)頁分別在兩個同級的文件夾中，就像此處的page1和pic1的關系，引用的代碼和顯示效果如下：
?。?）會不會有其它的情況？
理論上說會，實際上誰把網(wǎng)頁和相應的圖片放在那么遠的地方呢？
4、常見的圖片格式
（1）常見的圖片格式有兩類：位圖和矢量圖
位圖的常用格式有.jpg、.jpeg、.png、.gif，矢量圖的常用格式為.swf，它們的特點如下圖所示。
（2）以上三種位圖的引用代碼和顯示效果如下：
注意：這段代碼所用圖片與網(wǎng)頁在同一個文件夾內。
此網(wǎng)頁的背景設置成了藍色，大家可以清楚地看到，最后一張.png格式的圖片是透明的。
發(fā)布于2023-05-17
注意這里的圖片名pic2.jpg包括擴展名。
3、相對路徑
相對路徑是指相對于當前頁面的位置，這句話不好理解，我們通過4種情況來說明。
?。?）網(wǎng)頁和圖片在同一個文件夾里，就是這里的page3和pic1的關系或者page2和pic2的關系。這種情況直接引用圖片的名稱就可以。
?。?）圖片在與網(wǎng)頁同級的文件夾里，就是這里的page2和pic1的關系，這里要用到pic1所在的文件夾名。
?。?）圖片在網(wǎng)頁的上級文件夾里，就像page1和pic2的關系，引用代碼如下：
注意這段代碼里的“..”表示的是上一級文件夾。誰的上一級文件夾？當前網(wǎng)頁的所在文件夾的上一級。所以"..pic2.jpg"的意思是“本網(wǎng)頁的上一級文件夾里的pic2.jpg圖片”。
?。?）圖片和網(wǎng)頁分別在兩個同級的文件夾中，就像此處的page1和pic1的關系，引用的代碼和顯示效果如下：
?。?）會不會有其它的情況？
理論上說會，實際上誰把網(wǎng)頁和相應的圖片放在那么遠的地方呢？
4、常見的圖片格式
（1）常見的圖片格式有兩類：位圖和矢量圖
位圖的常用格式有.jpg、.jpeg、.png、.gif，矢量圖的常用格式為.swf，它們的特點如下圖所示。
（2）以上三種位圖的引用代碼和顯示效果如下：
注意：這段代碼所用圖片與網(wǎng)頁在同一個文件夾內。
此網(wǎng)頁的背景設置成了藍色，大家可以清楚地看到，最后一張.png格式的圖片是透明的。
