本文屬于網頁教學網閃電兒原創,轉載可以去掉這句話,但是不要以任何借口或方式更改文章的內容,否則后果自負!轉載請注明作者和出處。
很久以前一直到現在,有好多網友問過我類似的問題,尤其是拷貝了本站的一些圖形圖像特效代碼后,總是圖片顯示不出來等問題出現,在這里專門為這些初學者寫一篇相關的教程,如果您沒有這方面的疑問,請自行走開!
關于網頁中應用圖像的問題,也就是網頁中圖像標記的應用,下面給大家總結一下!
1)圖像標記概述。
如果網頁只有文字而沒有圖像,像失去了很多活力,圖像在網頁制作中是非常重要的一個方面,html專業提供了<img>標記來把圖像輸出到網頁上。該標記有src、alt、align、border、width和height屬性。
2)屬性介紹。
src屬性。對于<img>標記,其src屬性是必然屬性,即在<img>標記中src是必須賦值的,是標記不可缺少的一部分。這時,img應該寫成如下格式:
<img src=”參數值”>
其中,參數值為圖像的文件名全稱和路徑。
我們知道圖像文件占用的空間一般遠大于諸如html文檔這樣的純文本文件,而網頁設計經常需要加入許多圖像以便增加吸引力,如果這些圖像文件都要加入html文檔里,html文檔就會變得很大,在網絡上傳輸必然會很慢。
<img>標記并不是真正把圖像加入到html文檔中,而是告訴html:圖像文件是哪個?在哪里?以便html到圖像文件的原始位置去調用它。src屬性的作用就是回答這兩個問題,所以src屬性的參數值一定要有圖像文件的文件名全稱,即文件名和擴展名,如logo.gif,這就回答了圖像文件是哪個的問題;其參數值也要有圖像文件的路徑,以便html知道在什么地方去找到這個圖像文件。
src屬性的參數值中,如何撰寫圖像文件的路徑對于初學者往往是個問題。
圖像文件的路徑可以是相對路徑,也可以是網址。所謂相對路徑是指所要鏈接或嵌入到當前html文檔的文件與當前html文件的相對位置所形成的路徑。假如html文件與圖像文件(假設名字為logo.gif)在同一個目錄下,則可以將代碼寫成<img src=”logo.gif”>;假如該圖像文件放在當前的html文件所在目錄的一個子目錄(假設子目錄名為images)下,則代碼應為<img src=”images/logo.gif”>;假如該圖像文件放在當前html文件所在目錄的上層目錄(假設上層目錄名為home)下,則相對路徑必須是準網址了,即用“../”來表示開發者的網站,然后在后邊緊跟圖像文件在開發者網站中的路徑。例如,假設home是這個網站下的一個目錄,則代碼應該為<img src=”../home/logo.gif”>,若home是網站下的目錄king下的一個子目錄,則代碼應該寫為<img src=”../king/home/logo.gif”>。
其它屬性。<img>標記的alt、align、border、width和height屬性是可選的。align屬性是圖像的對齊方式,參數取值為左(left)、中(center)、右(right);border是圖像的邊框,其參數取大于或等于0,默認單位為像素;width和height屬性是圖像的寬和高,其參數的默認單位為像素;alt屬性是當鼠標移動到圖像上時顯示的文本,在這里提醒大家制作網頁時一定要使用該屬性,這樣做的目的是什么呢?是當圖像由于某種原因不能顯示時可以顯示提示的文字,這樣增加了對用戶的友好度。
|
新聞熱點
疑難解答