《网页的创建及基本.ppt》由会员分享，可在线阅读，更多相关《网页的创建及基本.ppt（20页珍藏版）》请在金锄头文库上搜索。
1、第2讲 网页的创建及基本结构第2讲 网页的创建及基本结构【知识学习目标】 了解和掌握HTML文档的基本结构、标记格式，为网页设计打下良好的基础。【能力训练目标】 组织个人网站的结构，能手工编写和修改最常用的HTML文档。【重点与难点】 重点：html文档的基本结构第2讲 网页的创建及基本结构2.1 HTML的基本结构2.2 网页的创建一个HTML的例子 厦门大学嘉庚学院简介 厦门大学嘉庚学院简介厦门大学嘉庚学院地处风景优美的漳州市龙海区，与厦门一海之隔。设有商学院、人文学院、建筑学院等3个分院，共有全日制在校生15000余人，师资力量雄厚。2.1 HTML的基本结构2.1.1 标记及基本属性标
2、记及基本属性 1、标记HTML文件由标记和被标记的内容组成。标记一般为英文单词或缩写。如：P、IMG、HR等可分为两类：一类：空标记，表示一个功能，单个出现。如：hr划横线 br换行二类：围堵标记，表示一个内容的范围及特性控制，成对出现如： 荆门职业技术学院简介一般格式为：受标记影响的内容2.1 HTML的基本结构使用标记注意事项：1每个标记必须使用包住，以示区别；2表示作用范围结束；3标记大小写均可；4多个标记可作用同一个范围，但一般要全包，顺序任意。2、标记的属性对标记内容特性的控制。一个标记通常有多个属性，以达到预期的效果。如： 机信分院、化工分院、医学分院、人文分院 注意：1不是所有标
3、记均有属性；2可同时使用部分或全部，顺序不限。 2.1 HTML的基本结构2.1.2 html文件基本结构文件基本结构文件的内容； 对文件的格式、特性进行表述的标记。 基本结构如下：网页标题2.1 HTML的基本结构2.1.3 文件结构的格式标记文件结构的格式标记1、标记功能：HTML文件的标志性标记，告知浏览器按HTML的标准解释后面的文件，直至遇到结束标记 为止。格式： 代码清单的第行 文件的全部内容文件清单的最后一行2.1 HTML的基本结构、功能：网页头部的标记，包含网页相关信息，定义的样式、使用的脚本等，除包含的内容显示在网页中外，其他的不显示在网页中。格式： 厦门大学嘉庚学院欢迎您
4、2.1 HTML的基本结构3、功能：各网页命名，并显示在浏览器的标题栏上。如果没有标题，则显示文档的路径及文件名。格式：网页名称，包含在与之间。例： 厦门大学嘉庚学院欢迎您 2.1 HTML的基本结构4、功能：标记网页中的主体内容。包含在与之内。所带属性为整个网页的属性。格式： 2.2 网页的创建2.2.1、编辑和保存网页、编辑和保存网页编辑：任何一个文本编辑器均可编辑，最简单的是“记事本”。按网页结构编写组织即可。保存：另存为，文件类型选所有文件格式，取名时注意加扩展名htm或html。2.2.2、站点的组织、站点的组织2.2 网页的创建2.2.3、预览网页、预览网页1、在IE浏览器中打开2
5、、双击html文档3、修改网页a.退出浏览器，用记事本修改、保存、查看b.在IE浏览器中用“查看”菜单中的“源文件”查看、修改、保存、刷新。 2.2.4、发布网页、发布网页 1、申请免费的个人空间和邮箱；2、站点格式组织网页3、通过ftp 程序（cuteFTP)上传站点所有网页。认识Dreamweaver 8 的界面插入栏文档工具栏浮动面板组“属性”面板扩展按钮状态栏创建、保存与打开、预览网页创建网页保存网页打开已有网页预览网页效果创建和管理站点创建站点管理站点编辑站点发布站点站点的本地测试l测试兼容性l测试链接l设置下载速度申请主页空间及域名发布站点管理站点站点宣传设置页面属性打开“页面属性”对话框l设置外观属性l设置链接属性l标题属性l标题/编码l设置跟踪图像小结1、HTML标记格式及作用2、html文档的结构及各部分的作用3、站点的结构4、网页的浏览及修改课堂练习1、按站点的要求建立文件夹，根文件夹取名“学号”2、制作主页，主页取名index.html ,内容为作业目录。3、制作一个对学院进行简介的网页4、建立相应的链接
