網站制作教程之如何創建圖像和鏈接?
上一節中,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所示。
推薦新聞
更多行業-
首頁內鏈到底多少合適?
SEO網站優化分內部優化和外部優化兩個部分,內鏈簡單的說就是我們網站內...
2013-12-18 -
哪些因素會影響網站制作的價格?
近年來,越來越多的企業會建設自己的網站,但是不同的網站建設公司,在進行...
2023-02-02 -
北京網站設計制作應要注意的幾個要點
無論是品牌推廣還是企業或個人的產品推廣,為企業或個人創建網站都是一種趨...
2020-06-30 -
為什么你的網站轉化率提升不上去
北京網站建設公司尚品中國:一個站點的成功運營既離不開一個穩定的高流量,...
2012-02-13 -
中國教育和科研計算機網(CERNET)
隨著人類的進步,科技的發展,人類的生活已經離不開網絡了,譬如:給孩子選...
2014-12-04 -
科研院所網站設計細節要注意什么?
科研院對于網站的使用十分的重視,這是為了提高對外的宣傳,以及文章的發布...
2023-02-24
預約專業咨詢顧問溝通!
免責聲明
非常感謝您訪問我們的網站。在您使用本網站之前,請您仔細閱讀本聲明的所有條款。
1、本站部分內容來源自網絡,涉及到的部分文章和圖片版權屬于原作者,本站轉載僅供大家學習和交流,切勿用于任何商業活動。
2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關法律法規,當本聲明與國家法律法規沖突時,以國家法律法規為準。
4、如果侵害了您的合法權益,請您及時與我們,我們會在第一時間刪除相關內容!
聯系方式:010-60259772
電子郵件:394588593@qq.com