HTML网页制作：[1]插入图片-趣百科

HTML网页制作：[1]插入图片

图片是网页制作的重要资源，没有图片的渲染和表示，网页将变的单调。那么如果在网页中插入图片呢？请往下看。

首先，通过TXT文档，创建一个网页的基本框架。

也就是html、head、body。

当然，用dw创建一个网页文档，会自动写入这些代码。

这里，小编使用的是dw.

图片的格式通过有3种：

1）GIF

2）JPEG

3）PNG

GIF最大的好处是可以制作动态图片。

具体选择何种格式，看你自己。

OK，请看笔者目录下的资源。

其中，.html文件，是我已经创建并保存好的网页

test.jpg是即将要插入的图片。

其实，最好的目录架构，是单独创建一个文件夹，比如img等，将图片资源放入其中。

笔者之所以这样，是为了截图方便。

那么如何插入图片呢？

非常简单，插入图片的标记值有一个：“img”标记！

请在body中加入如下一行：

由src指示图片的位置

双击该网页运行，便可看到网页中的图片了

如果感觉插入的图片太大，想更改图片的尺寸？

输入如下代码：

width表示宽度

height表示高度

入下图所示，我将图片的宽和高通通缩小，可以看到，图片的尺寸果然按照我的意愿进行了改变。

那如果想给图片加上边框呢？

输入以下代码：

border为边框的宽度，默认为黑色

看，这里图片外围，出现了黑色边框

网页中插入图片很简单，但是使用起来很复杂，不仅涉及到排版，还有颜色搭配、盒子模型等等。

HTML网页制作：[1]插入图片