初学HTML笔记(3)——<img>标签

<img>标签定义图像

  • 在HTML 4.01中,图像的”align”,”border”,”hspace”以及”vspace”不赞成使用。在HTML 5中不支持这些属性,使用CSS代替。
属性 描述
alt text 当图形显示错误时,定义图形的监简短描述
src URL 要显示的图形的URL
align top,bottom,middle,left,right 规定如何根据周围的文本来对齐图像,HTML5不支持,使用CSS代替
border pixels(像素数值) 定义图像周围的边框,HTML5不支持,使用CSS代替
height pixels% 定义图像的高度
hspace pixels 定义图像左侧和右侧的空白,HTML5不支持,使用CSS代替
vspace piexls 定义图像顶部和底部的空白,HTML5不支持,使用CSS代替
width pixels% 设置图像的宽度
title text 定义图像的名称,当鼠标移到图像时显示名称
 例:
<!DOCTYPE html>
<html>
<head>
    <base href="E:\Image\穿越时空的少女\" >
    <meta charset="utf-8">
    <title>image</title>
</head>
<body>
    <img src="9cdf793e2f73993a82850fdd0cf90a991e3f9991118e2-NiK5hC_fw658.jpg" 
    alt="该图片无法显示" width="200" title="穿越时光的少女" border="2">
    <!--<img src="20140713070017_5QC34.thumb.700_0.jpeg">-->
</body>
</html>

在上例中使用了<base>标签,将基准URL放到<base>标签中。页面显示为:
这里写图片描述
黑色边框为border属性的显示效果。title属性页面显示,鼠标移到图像显示的“穿越时空的少女”。
图像的路径:图像与HTML文件在同一个文件夹下时,可以使用相对路径,当文件与图像不在同一个文件夹下时使用绝对路径。

猜你喜欢

转载自blog.csdn.net/qq_40474184/article/details/81839707
今日推荐