網站制作教程之如何創建圖像和鏈接?
上一節中，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所示。
推薦新聞
更多行業-
當高校網站建設遇到綠蘿算法
眾所周知，網站建設解釋“綠蘿”有“凈化”之意。百度用這個意思命名算法，...
2022-03-08 -
網站制作中如何做好網站關鍵詞篩選
在 SEO 優化過程中，一般情況下 SEOer 們都會選擇一些最熱門的...
2012-07-21 -
網站建設中如何降低網站的跳出率
優化網站時，網站質量的一個非常重要的指標是網站的跳轉率。如果跳轉率太高...
2020-03-05 -
IBM元老級前CEO逝世 曾推出首臺個人電腦
IBM元老級前CEO逝世 曾推出首臺個人電腦 19世紀80年代，約...
2011-11-08 -
B2C網站被降權的四大原因
雖然只總結了四大罕見的原因，以上便是對B2C網站被降權原因的總結。目前...
2012-07-12 -
建設企業網站如何豐富自己的網站
常見問題，分為售前問題、售中問題和售后問題，而且是分布在不同的頁面，解...
2020-01-14
預約專業咨詢顧問溝通！
尚品專注高端網站建設，系統平臺開發，微信小程序及APP開發服務
免責聲明
非常感謝您訪問我們的網站。在您使用本網站之前，請您仔細閱讀本聲明的所有條款。
1、本站部分內容來源自網絡，涉及到的部分文章和圖片版權屬于原作者，本站轉載僅供大家學習和交流，切勿用于任何商業活動。
2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關法律法規，當本聲明與國家法律法規沖突時，以國家法律法規為準。
4、如果侵害了您的合法權益，請您及時與我們,我們會在第一時間刪除相關內容!
聯系方式：010-60259772
電子郵件：394588593@qq.com
