網站制作教程之如何創建圖像和鏈接?
上一節中,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所示。
推薦新聞
更多行業-
企業網站可信度如何建立
(1)對企業基本狀況的介紹真實可信; (2)網站具有必須的法定證書;(...
2015-01-16 -
朋友一生一起走 喬布斯去世前保留蓋茨信件在床頭
北京時間1月30日消息,微軟創始人蓋茨曾給蘋果聯合創始人喬布斯寫了一封...
2012-02-03 -
科技智能網站建設的發展趨勢
隨著科技的不斷發展和智能化的快速推進,網站建設也在不斷演變和改進。科技...
2023-07-03 -
科研網站制作公司如何優化標題?
對于從事科研網站制作優化的工作人員來說,網站優化不僅僅是關鍵詞和外部鏈...
2022-01-24 -
站長應換位思考_用戶需要怎樣的網站制作
用戶是網站運營的核心體系,隨著各大搜索引擎對算法的嚴格要求,seo優化...
2013-07-30 -
汽車網站建設的基本流程是什么?
汽車網站作為一個行業性網站,其建設過程需要經過詳細的規劃、設計、制作、...
2023-04-07
預約專業咨詢顧問溝通!
免責聲明
非常感謝您訪問我們的網站。在您使用本網站之前,請您仔細閱讀本聲明的所有條款。
1、本站部分內容來源自網絡,涉及到的部分文章和圖片版權屬于原作者,本站轉載僅供大家學習和交流,切勿用于任何商業活動。
2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關法律法規,當本聲明與國家法律法規沖突時,以國家法律法規為準。
4、如果侵害了您的合法權益,請您及時與我們,我們會在第一時間刪除相關內容!
聯系方式:010-60259772
電子郵件:394588593@qq.com