网站制作教程之如何创建图像和链接?
发布时间:2021.09.14

上一节中,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所示。

营销型网站建设代码分析:要从一个页面跳转到另一个页面,可以用链接标签<a>,在本例中,<a>标签有一个属性"href”用来指定需耍到达的页。有了链接,就不需要每次都在浏览器地址栏输入地址,直接单击链接后就可以到达想去的地方,就像现在人们使用的Internet,一个网站链接着另一个网站,而另一个网站又链接着其他网站,最后组成了不知道有多大的网。
上一篇:教你如何快速制作自己的网站 下一篇:尚品VR720°全景展示介绍及优势

Copyright 2022 © 北京快帮科技集团有限公司 All Rights Reserved 京ICP备16051929号

北京快帮科技集团有限公司-北京网站建设/ 高端网页设计/ 天津网站建设/ 河北网站建设/ 武汉网站建设/ 上海网站建设/ 厦门网站建设/ 深圳网站建设/ 泉州网站建设/ 海南网站建设/ 青岛网站建设

24小时服务热线:4008-919-003 售后服务邮箱:kf@kbyun.com