網站制作教程之如何創建圖像和鏈接?
上一節中,3個村民排列了自家的產品,這回, 其中第一個村民為了和其他村民競爭,給產品加上了圖片。圖形化網頁列表如代碼1-3所示。
打開記事本,輸入以上代碼,另存文件名為“img.htm"至桌面,雙擊“img.htm”文件,顯示結果如圖1.5所示。
提示:此時是看不到圖片的,趕緊上網找幾張冬瓜、西瓜、南瓜的圖片,然后在桌面新建文件夾“images",將找到的圖片放入“images’文件夾,重新打開img.htm看看,就能看到了。
網站建設代碼分析:在網頁中加入圖片用<img>標簽,在本例中,<img>標簽有3個屬性,屬性之間用空格分隔,其中“src"屬性指定圖片的徑,"width"屬性指定圖片的寬度,"height"屬性指定圖片的高度。
自從第一個村民給冬瓜、西瓜、南瓜加上圖片后,其他村民紛紛效仿,直到后來每個人的產品都越來越多時.一個頁面就放不下所有的圖片了。這時,第蘭個村民潛心學習幾天后,決定進行改版,將原有的圖片分離列表頁,列表僅用于顯示產品的名稱和說明,名稱上加鏈接,單擊名稱就可以看到圖片。
第三個村民共有4個頁面源代碼。打開記事本,輸入代碼1-4,另存文件名為“links.htm"至桌面。
打開記事本,輸入以下代碼,另存文件名為"donggua.htm"至桌面。
打開記事本,輸入以下代碼,另存文件名為“nangua.htm”至桌面。
都保存好后,回到桌面,雙擊"links.htm”文件,瀏覽器顯示結果如圖1.6所示。
頁面內容中的冬瓜、西瓜和南瓜都有了顏色和下畫線,這說明冬瓜、西瓜和南瓜分別都有一個鏈接,單擊后會跳轉到另一個地方。單擊任意一個鏈接,例如冬瓜,瀏覽器跳轉到“donggua.htm",到達"donggua.htm"后,還可以單擊“返回列表”鏈接回到“links.htm", 如圖11.7所示。
推薦新聞
更多行業-
淺析企業營銷型網站建設
在中小型企業的網站建設之路上,因為廣州網站建設資金、實力等的差距,不能...
2013-10-29 -
如何看:網站優化有哪些技巧
相信很多站長都遇到過這種情況,春節回家過年花梔子后,發穿山甲現網站的排...
2013-03-05 -
基金會網站建設解決方案
需求分析:了解基金會的目標、宗旨、活動、項目等具體需求。確定網站的功能...
2023-06-26 -
證券交易的特點
納斯達克證券市場同傳統的證券交易所最大的區別與特色有以下三點。一、做市...
2014-09-09 -
企業網站建設-網站SEO優點和缺點有哪些?
從長期的網站推廣效果角度考慮,網站優化的整體效果是遠強于競價排名的,價...
2018-08-16 -
網絡證券:虛擬化的先導
為什么網絡證券會有如此迅速的發展?為什么在互聯網狀況調查中,會有高達5...
2014-09-11
預約專業咨詢顧問溝通!
免責聲明
非常感謝您訪問我們的網站。在您使用本網站之前,請您仔細閱讀本聲明的所有條款。
1、本站部分內容來源自網絡,涉及到的部分文章和圖片版權屬于原作者,本站轉載僅供大家學習和交流,切勿用于任何商業活動。
2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關法律法規,當本聲明與國家法律法規沖突時,以國家法律法規為準。
4、如果侵害了您的合法權益,請您及時與我們,我們會在第一時間刪除相關內容!
聯系方式:010-60259772
電子郵件:394588593@qq.com