首页 > 代码库 > HTML学习笔记4—图像

HTML学习笔记4—图像

    1.设置网页的背景图案

      格式:<body background=”URL”>

      例如:<body background=“1.gif”>

    2.将图片插入到网页中

      格式:<img src="http://www.mamicode.com/URL">

      功能:将图片插入到网页中去,单一标签

    3.<img>标签的属性

        属性名称         属性值                     说明

        src              URL                      图片的路径

        alt              字符串                   给图片做注解

        width            像素/百分比              设置图片宽度

        height           像素/百分比              设置图片高度

        border           数字(像素)             图象边框的设置

        vspace           像素                     垂直上下两端与物件距离

        hspace           像素                     水平左右两段与物件距离

    4.将图片作为超连接

      格式:<a href="http://www.mamicode.com/URL"><img src="http://www.mamicode.com/URL"></a>

            将图片作为连接时,有的浏览器会显示有边框,使用<img>的Border属性将边框设置为0就可以了。

            例如:<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/images/taobao_08.png" border="0"/></a>

    5.为网站添加图标

        <link rel="shortcut icon" href="http://www.mamicode.com/favicon.ico" type="image/x-icon“/>

    6.地图索引

      格式:<img src="http://www.mamicode.com/URL" USEMAP="#图象名称">

           <map name="图象名称" id="图象名称">

                <area shape=“选取区块的形状”coords=“坐标”href=http://www.mamicode.com/“URL”alt=“文字说明">

           </map>

            <map>声明整张图使用地图链接方式进行连接.

            name,id指此图的名称.

            <area>表示我们所要链接其中一点的区快

            shape表示我们所选择的形状,如:rect矩形circle圆poly多边形

            coords 表示地图的坐标位置!!

        例如:<img src="http://www.mamicode.com/1111.png" width="218" height="416" usemap="#Map" border="0" />

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

<area shape="rect" coords="9,14,183,52" href="http://www.baidu.com" />

<area shape="rect" coords="8,61,187,98" href="http://www.youku.com" />

<area shape="rect" coords="7,106,187,146" href="http://www.mamicode.com/#" />

<area shape="rect" coords="2,151,184,190" href="http://www.mamicode.com/#" />

              </map>


本文出自 “Raffaele” 博客,请务必保留此出处http://raffaele.blog.51cto.com/6508076/1556974

HTML学习笔记4—图像