`
save
  • 浏览: 8211 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

XHtmlFour

阅读更多
<!-- 1.背景图案的设置               2.将图片插入到网页中去        3.用图像作为超链接 -->
<!-- 4.使用工具建立地图索引      5.切片索引                          6.为网站添加图标    -->

<html> <!--根控制标记(头)-->
<head> <!--头控制标记(头)-->
  <title>图片运用</title> <!--站点标题-->
  <link rel="shortcut icon" href="KuGouMusic.ico" type="image/x-icon"> 
<!--网站站点图标,经过测试,火狐支持,IE不支持-->
</head> <!--头控制标记(尾)-->

<body background="#URL图片路径">  <!--显示区控制标记(头)-->
 <!--img图片标记 属性: src URL图片路径,alt 字符串 给图片加文字注解,width height 给图片做固定的高宽 -->
 <!--img图片标记 属性: border 图片边框粗细,align  -->
 <!--img图片标记 属性: border 图片边框粗细,align="left" 让图片往左撞 空出右边显示其他内容 -->
 <!--img图片标记 属性: vspce="垂直上下两端与物件的距离" hspce="水平左右两段与物件的距离" -->
<img src="bg.jpg" align="left" vspace="20" hspace="20" alt="这是做程序员的下场" width="200" height="150" border="1"><br>
W3C 对Web 混乱状态采取的第一项措施是对专有的扩展进行标准化,将一些扩展吸收
到正式规范中,而将其他扩展完全取消了。同时,他们鼓励浏览器厂商尽可能支持正式的H
TML 标准,从而使根据标准编写的网页在不同的浏览器中有一致的表现。
<a href="http://www.allead.cn"><img src="bg.jpg" border="0" usemap="#Map"> 
<!--超链接<a>图片</a> usemap="#map"    #map=map标记(name="Map")-->
<map name="Map"> <!--做图片的索引-->
<!--shape="选取区块的形状 rect 方块circle圆 poly多边形" cords="坐标点" href="URL" alt=图片说明 target="连接方式"-->
<area shape="rect" coords="252,21,350,129" href="http://www.163.com" alt="圆" target="_blank"> 
<area shape="circle" coords="505,295,154" href="http://www.baidu.com" target="_blank"> 
<area shape="poly" coords="553,26,705,11,742,41,725,79,665,110,596,103" href="http://www.google.cn" target="_blank">
</map>
</a>

<!--图片切片,整合成一张图,实现多超链接,表控制-->
<!--border="表边框的粗细" cellspcing="内边框的间距" cellpadding="内边框与数据的间距"-->
<table border="0" cellspacing="0" cellpadding="0"> <!--表头-->
  <tr><!--超链接图片时,需让图片边框设为0方块整合图片 可加target="连接方式"-->
    <td><a href="http://www.allead.cn"><img src="1.jpg" border="0"</a></td>   
    <td><a href="http://www.baidu.com"><img src="2.jpg" border="0"></a></td>
  </tr> 
  <tr>
    <td><a href="http://www.baidu.com"><img src="3.jpg" border="0"></a></td>
    <td><a href="http://www.google.cn"><img src="4.jpg" border="0"></a></td>
  </tr>	
</table> <!--表尾-->

</body> <!--显示区控制标记(尾)-->

</html> <!--根控制标记(尾)-->
0
0
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics