HTML中的图象标签属性
所属分类:
网络编程 / CSS/HTML
阅读数:
1276
收藏 0赞 0分享
HTML中的图象标签属性
图象可以使网页更加生动美观。浏览器可以显示JPEG和GIF图象,其中GIF图象最多只能使用256种颜色(即只能保存为8位颜
色),而JPEG格式可保存为24位,对具体连续色调的图象有最佳效果。不过,GIF图象虽然在图象质量上不及JPEG图象,但
其所占的存储空间下,下载速度快。因此应视不同情况而决定使用哪种格式的图象。
在HTML文档中插入图象是通过<IMG>标签来实现的。该标签共有个9个属性。除属性SRC是不可缺省的外,其他的属性都是可
选的。
一,SRC属性。SRC即Source,该属性用以指出被引用的图象文件所在的位置。例如:
绝对路径表示法:<IMG SRC="http://page2000.xiloo.com/web/icon.html">
相对路径表示法:<IMG SRC="web/icon.html">
SRC的属性参数值就是图像文件的URL。注意,只有当图象文件和HTML文档在同一目录下时才可采用相对表示法来标识图象文
件的位置。
二,ALIGN属性。align属性的参数值为top,middle,bottom.分别表示图象相邻的文字位于图象的左上方,左面中间,和右下
方。例如:
<html>
<head>
<title>测试页面</title>
</head>
<body>
<HR>
<IMG src="http://www.knowsky.com/icon.gif"ALIGN=bottom> 我的图标好看吗?
<br>
<HR>
<P><BR>
再看看这个怎样?
<img src="http://www.knowsky.com/me.gif"align=top WIDTH=100 HEIGHT=100><br>
<p>
<HR>
</body>
<html>
可以将图象换成你自己的。注意,浏览器默认的目录是windows/TEMP临时文件夹。你需要指定图象所在的目录。
四,ALT属性。用户在浏览网页时,常常会为了节省时间或其他的原因选择不下载图片,加入ALT属性可以在原本显示图片的
位置显示一些有关于该图象的信息。ALT属性的参数值就是网页编辑者希望在在原本显示图象的地方出现的文字信息,一般
是图象的名称和简要的说明。例如。
<html>
<head>
<title>测试页面</title>
</head>
<body>
<HR>
<IMG src="http://www.knowsky.com/icon.gif"ALIGN=bottom ALT="这是我的图标">
你看不到吧?嘿嘿
<br>
<HR>
<P><BR>
<br><P>
</body>
</html>
五,确定图象边距的属性。
<IMG>标签用vspace和hspace这两个属性来确定图象与其像邻的对象之间的空白大小。vspace属性用于指定图象与其垂直方
向上相邻对象之间的距离。hspave用来指定图象与其水平方向相邻对象之间的距离。这两个属性的参数都是数字,表示空出
距离的像素点数。
六,BORDER属性。
浏览器在调用图象时会根据浏览器窗口和原始图象大小的不同给图象加上不同宽度的边框。我们可利用border属性来指定图
象边框的宽度或者取消边框<border=0>。border属性的参数值也是数字,表示边框宽度所占的像素点数。例如:
<html>
<head>
<title>测试页面</title>
</head>
<body>
<HR>
<IMG src="http://www.knowsky.com/me.gif"ALIGN=top border=5>
看看效果就行。
<br>
<HR>
<P><BR>
</body>
</html>
border的参数值越大边框越大。
七,ISMAP属性
这个属性于文档的超链接有关,我们以后在详细讲解它。
简单明了带你了解CSS Modules
不要误会,CSS Modules可不是在说“css模块化”这个好像在某些地方见过的词,它其实是特指一种近期才出现的技术手段。什么技术手段呢?下面小编来和大家一起学习一下
收藏 0赞 0分享
新手学习css优先级
大部分人同样也会在写css的过程中产生很多困惑,比如为什么自己写的某段css没有生效,或者呈现出的样式和预计的不同,但又不知道要如何解决。下面小编来和大家一起学习CSS的优先级
收藏 0赞 0分享
css进阶学习 选择符
css这种没有程序逻辑的代码中,又能找出什么来说明谁做得更出色呢?下面小编给大家说明如何从css选择符的角度来提高css代码质量。
收藏 0赞 0分享
实现css文字垂直居中的8种方法
CSS可以轻易实现文字的水平居中,但有时我们需要文字垂直居中,除了表格可以实现这种CSS文字垂直居中以外,还有其它几种方法可以做到
收藏 0赞 0分享
完美实现CSS垂直居中的11种方法
在做前端项目时CSS的水平居中我们经常使用,但有时还会用到CSS垂直居中,对于小白来说这个就有些难度了,下面看一下我是如何实现的
收藏 0赞 0分享
webpack高级配置与优化详解
这篇文章主要介绍了webpack高级配置与优化,其中包括了webpack打包多页面,webpack跨域问题等相关内容
收藏 0赞 0分享
5个HTML5的常用本地存储方式详解与介绍
在HTML5规范之前,存储主要是用cookies,但cookies缺点有在请求头上带着数据,大小是4k之内,今天为大家介绍一下H5的5种存储方式
收藏 0赞 0分享
查看更多