5.HTML——嵌入图片与创建分区响应图

HTML5嵌入图片与创建分区响应图

 

1.<img>

      Src:设置图片的位置(显示图片)

      Width:设置图片的宽度

      Height:设置图片的高度

      Alt:设置图片的备用内容【就是当输入进去图片的地址不存在或者丢失的时候,可以对帮助用户知道这里面是什么内容,一个提示】

 

2.在超链接里嵌入图像

    常用方法:用a标签结合创建一个基于图像的超链接

    格式:<a herf="  "><img src="  "></a>

 

3.创建客户端分区响应图(通过点击某张图像上的不同区域让浏览器到不同的url)

<img src="      " usemap="#A">

<map name="A">

     <area href="aa.html" shape="rect" coords="12,28,56,96" target="_black">

     <area  href="bb.html" shape="rect" coords="12,28,56,96" target="_black">

     <area  href="xx.html" shape="rect" coords="12,28,56,96" target="_black">

【这里的xx.htm等值得是受到用户的点击需要跳转的页面,rect是矩形的意思,后面的四个数字值得是这张图片包含的区域坐标范围,分别是最左边缘,最上边缘,最右边缘,最下边缘

 和rect并列的是Circle,三个整数所代表的分别是图片最左端到圆心的距离,图像最右端到圆心的距离,半径长度还有Poly代表多边形,有六个证书,每一个数字代表多边形的一个顶点Dagault代表默认区域,覆盖整张图片,覆盖整张照片,s不需要coords

  

 target="_blank:每一次点击都打开新的窗口

 target="_black:当心的标签已经打开了,点击第二次就不会打开新的标签,而是刷新之前的标签

发布了20 篇原创文章 · 获赞 17 · 访问量 161

猜你喜欢

转载自blog.csdn.net/weixin_46319702/article/details/105038805