本文详细介绍了在HTML中如何插入和操作图片，包括基本语法、常见属性、图片超链接、设置图片热区链接、将图片设为背景以及如何插入多媒体文件。通过实例展示了如何控制图片大小、创建图片超链接和背景图片效果，还提及了滚动字幕和多媒体文件的使用方法。
目录
48.1 网页中插入图片
48.1.1 基本语法
<img src=“图片地址”>img 标记用于将图像插入到 HTML 文档中，src 是它的一个必要属性，而值
是指定图像文件位置的 URL 。
<html>
<head>
<title>插入图片</title>
</head>
<body>
<img src="images/flower1.jpg"/>
</body>
</html>在浏览器中打开网页，效果如下：
48.1.2 常见属性
图片大小控制： height、width
height 和 width 分别控制图片的高度和宽度。如果只设置了其中的一个属性，则另一个就按照图片的原始长宽比例来显示。如果两个都设置，则图片将根据所设置的值显示。其值的单位可以是像素 (px) 和百分比（相对于当前窗口的大小），默认为像素。
<html>
<head>
<title>图片的大小控制</title>
</head>
<body>
<img src="images/flower1.jpg" width="100" />
<img src="images/flower1.jpg" width="100" height="100" />
<img src="images/flower1.jpg" width="50%" />
</body>
</html>
在浏览器中打开网页，效果如下：
文字代替图片显示
alt
当浏览器不能正确显示所指定的图片时，可以用该属性代替图片显示，起到说明的作用。
<html>
<head>
<title>文字代替图片</title>
</head>
<body>
<img src="flower1.jpg" alt="花" width="150" />
</body>
</html>
在浏览器中打开网页，效果如下：（该示例图片路径出错。无法正确显示图片）
最低0.47元/天 解锁文章
扫一扫
4562
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
