1、首先,我们熟悉一下网页的各个部分,要看仔细哦。如图所示
![零基础制作网页:[8]网页与源代码的比对](https://exp-picture.cdn.bcebos.com/bbf95c406afec3147a04f85acac1b727ad539c15.jpg)
2、打开Dreamweaver对源代码进行比对学习。
![零基础制作网页:[8]网页与源代码的比对](https://exp-picture.cdn.bcebos.com/91091efc77f7980ec7e12ec5d4db3620b83a9115.jpg)
3、我们要先熟悉一下保存在Dreamweaver的网页源代码,先给大家简单介绍一下大体的网站框架。
![零基础制作网页:[8]网页与源代码的比对](https://exp-picture.cdn.bcebos.com/589f5b0788013870738057382d08a50f95fc8315.jpg)
4、一般情况下一个网站由以下几个大部分构成,head头文件部分body网页内容部分以及html一个网页的开头和结尾,如下图,我们用Dreamweaver新建一个网页进行简单的了解。网页的标题部分在head头部文件内。
![零基础制作网页:[8]网页与源代码的比对](https://exp-picture.cdn.bcebos.com/890dfb4a2f27e7ef9cc706b519dd3340b7f3f515.jpg)
5、我们以我们保存的网站页面进行简单的其他html语句的了解,这可能会需要大家比较长的时间去学习,但是并不复杂。我们点击所保存文件的logo部分,发现左侧的代码部分会议不同于其靓脘堤窳他代码的方式显示,我们看到显示的代码是:<td width="249"><img src="imgbyw/logo.jpg" width="973" height="90" /></td>我们的logo部门肯定是一个图片,那么我们就先认识一些html语言
![零基础制作网页:[8]网页与源代码的比对](https://exp-picture.cdn.bcebos.com/a9338a1fbee434da339f2797f271fe1d97d8e415.jpg)
6、这里边所涉及到的html语言有,td,width img src heightwidth height可以从字面进行记忆分别带别宽度和高度,img是图片的意思,src代表的是文件地址的意思,td是table data cell的缩写,HTML标签, 代表HTML表格中的一个单元格,但是我们可以注意到td是前边安歇代码的区别是td是以<td></td>成对出现的,而其他的并不是。好了这一期我们就写到这里,相信大家对比对学习网页设计有了一定的了解,这只是一个方法我们还是要仔细的去学习代码只是才能更好的利用源代码写出自己需要的网页文件。
![零基础制作网页:[8]网页与源代码的比对](https://exp-picture.cdn.bcebos.com/a68c126efbf202b3bb16f4cf30f4da5873dadb15.jpg)