<html>
<body>
<p>
一幅图像:
<img src=“/eg_mouse.jpg" width="128" height="128">
</p>
<p>
一幅动画图像:
<img src="/eg_cute.gif" width="50" height="50">
</p>
<p>请注意,插入动画图像的语法与插入普通图像的语法没有区别。</p>
</body>
</html>
从不同的位置插入图片
<html>
<body>
<p>
来自另一个文件夹的图像:
<img src="/ct_netscape.jpg" />
</p>
<p>
来自 W3School.com.cn 的图像:
<img src="http://www.w3school.com.cn/i/w3school_logo_white.gif" />
</p>
</body>
</html>
背景图片
<html>
<body background="/i/eg_background.jpg">
<h3>图像背景</h3>
<p>gif 和 jpg 文件均可用作 HTML 背景。</p>
<p>如果图像小于页面,图像会进行重复。</p>
</body>
</html>
排列图片
<html>
<body>
<p>
图像
<img src="/i/eg_cute.gif" align="bottom">
在文本中
</p>
<p>
图像
<img src ="/i/eg_cute.gif" align="middle">
在文本中
</p>
<p>
图像
<img src ="/i/eg_cute.gif" align="top">
在文本中
</p>
<p>请注意,bottom 对齐方式是默认的对齐方式。</p>
<p>
图像
<img src ="/i/eg_cute.gif">
在文本中
</p>
<p>
<img src ="/i/eg_cute.gif">
图像在文本前面
</p>
<p>
图像在文本后面
<img src ="/i/eg_cute.gif">
</p>
</body>
</html>
浮动图像
<html>
<body>
<p>
<img src ="/i/eg_cute.gif" align ="left">
带有图像的一个段落。图像的 align 属性设置为 "left"。图像将浮动到文本的左侧。
</p>
<p>
<img src ="/i/eg_cute.gif" align ="right">
带有图像的一个段落。图像的 align 属性设置为 "right"。图像将浮动到文本的右侧。
</p>
</body>
</html>
调整图像尺寸
<html>
<body>
<p>
<img src="/i/eg_mouse.jpg"
width="40" height="40">
</p>
<p>
<img src="/i/eg_mouse.jpg"
width="80" height="80">
</p>
<p>
<img src="/i/eg_mouse.jpg"
width="128" height="128">
</p>
<p>通过改变 img 标签的 "height" 和 "width" 属性的值,您可以放大或缩写图像。</p>
</body>
</html>
制作图像链接
<html>
<body>
<p>
您也可以把图像作为链接来使用:
<a href="/example/html/lastpage.html">
<img border="0" src="/i/eg_buttonnext.gif" />
</a>
</p>
</body>
</html>
已有 22658 名学员学习以下课程通过考试
最需教育客户端 软件问题一手掌握
去 App Store 免费下载 iOS 客户端
点击加载更多评论>>