Html<img>标签特写 2017-03-10 AM

1、插入图片

<img src="picture1.gif" width="300" height="100" title="图片1"/>

注:

(1)title属性:当鼠标移到图片时显示图片1.

(2)Title与alt 的区别:

           Alt是当图片不存在时,替代图片的文字;title是对图片的进一步描述和说明。

2、用图片创建超链接

(1)<a href="http://www.baidu.com.cn">

              <img src="picture1.gif" width="300" height="100" title="图片1"/>

</a>

效果:点击该图片可以链接到百度页面;

(2)<a href="#">

              <img src="picture1.gif" width="300" height="100" title="图片1"/>

       </a>

效果:链接到顶部(创建本页面锚点)  #不要忘

3、划定图片区域创建超链接(不常用)

步骤(DW为例):

设计视图---选中图片---在左下角选(长方形,圆形,或多边形图标)---选中截取图片---输入链接地址---保存---查看代码

<img src="2.jpg" width="100px" height="100px" usemap="#Map" title="哈哈哈" border="0"/>

         <map name="Map" id="Map">

           <area shape="circle" coords="65,76,29" href="http://www.baidu.com" />

</map>

注:coords: 表示坐标 

长方形(rect)会有四个数字代表左上角和右下角的坐标

圆形(circle)前两个数字为圆心坐标,后一个数字为半径

多边形:将图片的每一个转折点的坐标一次填入

Map:表示图片名称  要求:与<map>标记中的name参数值一致

Reflection:

Maybe It's because I have learned something about what I am learning now, I did the homework simply without some basic knowledge. Please remember its your homework, complete it with all the knowledge you just learned and make them show on the screen instead of thinking in your own mind. And learn from zero.

原文地址:https://www.cnblogs.com/chenguanai/p/6529512.html