网页中最引人入胜的莫过于那丰富多彩的图像了。成功的站点中不能没有绚丽的图像,否则便使测览者觉得索然无味。下面介绍HTML语言中的基本图像标记:<img>。其基本语法结构如下:
<img
align=top|middle|center|bottom|left|right
class=type
id=Value
name=value
src=url
title=text
alt=value
border=n
height=n
width=n
hspace=n
vspace=n
ismap=image
usemap=url
onload=function
onabort=function
onerror=function
dynsrc=url
controls=controls
loop=n
start=type>
可以看出,关于基本图像标记<img>的应用参数多达21项。当然,我们实际应用的只是其中几项,只有在需要实现非凡效果的情况下,才需要使用较多的参数。下面先介绍一下各参数的具体含义:
align:是指定图像的位置是靠左、靠右、居中、靠上或者是靠底。默认情况下是靠上,即align=top。在图文混排时,这个参数很有用。
class和id:分别指定图像所属的类型和图像的id号。
name:用于设定图像的名称。
src:规定插入的图像的url地址,也就是含路径的图像文件名。
title:设定图像的标题。内容来自中国站长资讯网(www.chinahtml.com)
alt:表示图像的替代字,主要用于在浏览器还没有装入图像(或关闭图像显示)的时候,先显示有关此图像的信息。这是初学者最易忽略的参数,因不设定它在正常显示时没问题。
border:设定图片的边框。
height和width:分别用于指定图像的高度和宽度,可以与图片原来的宽度和高度不同。中国站长第一门户
hspace和vspace:分别用于设定图像的左右边框大小和上下边框大小,在图文混排时会用到。
ismp和usemap:在应用图像地图时使用。ismap表示图像地图的数据存放在服务器中,当鼠标在图像上的某个区域上时,可以将此区域的坐标传送给服务器处理。usemap则用于设定图像地图的名称。
onload、onabort、onerror对应于设定的子程序,分别在图像被载入、取消载入、载入出错的情况下各自对应的子程序,不常用。
dynsrc:指定要下载的影像片断的url地址。内容来自中国站长资讯网(www.chinahtml.com)
controls:设定影像播放的控制接钮。
loop:指定影像片断的播放次数,当loop=-1时,影像片断将循环播放直至页面更新。中国站长第一门户
start:设定何时开始播放影像片断,有三种选择:start=fileopen表示页面载入后即开始播放,默认的就是这种状态;start=mouseover表示当鼠标移到影像上即开始播放;start=fileopen,mouseover表示当有上面两种情况之一发生时就开始播放。
应用技巧
1、给图片加边框
上边这张图片的边框是border="4"所产生的效果,注重:边框的颜色默认的是黑色,不美观,而<img>标记也没有设置边框颜色的参数,我们可以通过设置Class参数调用CSS达到改变边框颜色的目的,如本例的完整代码是:
<img src="/images/logo.gif" width="180" height="60" border="4" alt="站长资讯欢迎您" align="left" class="style1">,这里的CSS的“style1”放在网页源代码的<head>与</head>之间,其代码为:
<style type="text/css">
<!--
.style1 { border-color: #009900 }
-->
</style>
评论加载中…
![]() |