深入理解HTML图像_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:32:34
Original
1558 people have browsed it

目录

[1]深入理解HTML图像_html/css_WEB-ITnose [2] [3]

深入理解HTML图像_html/css_WEB-ITnose -> image 图像

    【必须属性】

        【1】src:地址

        【2】alt:图像替代文本,供探索引擎抓取使用

    【可选属性】

        【1】height:图像高度

        【2】width:图像宽度

        【3】ismap:为图像定义为服务器端图像映射

        【4】longdesc:与alt属性类似,提供多于1024字符的长文本描述

        【5】usemap:为图像定义客户端图像映射 usemap = "#元素的name或id属性"

<img src="test.jpg" alt="测试图片"    style="max-width:90%"  style="max-width:90%">
Copy after login

映射地图

[注意]深入理解HTML图像_html/css_WEB-ITnose中的usemap属性可引用中的id或name属性(取决于浏览器),所以应同时向添加id和name属性。

图像热区

  总是嵌套在标签中

【必须属性】

【1】alt:替代文本

【可选属性】

【1】coords:定义可点击区域的坐标

【2】href:定义此区域的目标URL

【3】nohref:排除某个区域

【4】shape:定义区域的形状

    【a】圆形(circ/circle) coords= "x,y,r" x,y是圆心坐标;r是半径

    【b】多边形(poly/polygon) coords = "x1,y1,x2,y2,x3,y3……" x,y是多边形每个顶点的坐标

    【c】矩形(rect/rectangle) coords = "x1,y1,x2,y2" x1,y1是左上角坐标;x2,y2是右下角坐标

【d】全部区域default(默认)

[注意]标签采用"先来先得"的顺序,如果区域有重叠,以先出现的为准

<img src="jihe.jpg" alt="几何图形"    style="max-width:90%"  style="max-width:90%" usemap="#map"><map name="map" id="map">  <area shape="rect" coords="35,38,150,158" href="line4.html" alt="四边形">  <area shape="poly" coords="175,109,193,44,268,41,296,109,233,151" href="line6.html" alt="六边形">  <area shape="poly" coords="315,81,330,58,356,40,387,37,411,52,430,79,433,108,418,132,389,153,357,154,333,137,315,108" href="line12.html" alt="12边形">  <area shape="circle" coords="512,95,60" href="line0.html" alt="圆形"></map>
Copy after login

 

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!