框架网页设计

框架网页 精品资料编辑 1.单击上部横幅框架的"新建网页"按钮,在编辑区内首先插入装饰图片,然后输入饭店中英文名称,字号为6,中文为宋体,英文为行楷,设置背景色为RGB(FF,FF,66).... 框架 框架网页设计 黄 丽 这次课中，我们将初步理解框架的概念和在网页设计中的作用，并且通过下面例子熟悉有关框架的基本操作步骤。 实例一:基本框架操作——饭店信息 步骤:(一)框架布局 单击“新建”——“网页”选项，在出现的“网页”对话框中，选择“框架选项卡”，在具体对话框中，双击“横幅和目录”模板，框架布局就完成了。 在这一步中，要明确框架的概念。框架是一种特殊的网页，它将浏览器窗口分成几个小窗口，而且每个小窗口都可以显示一个独立的网页。在看到的网页中，每一个拆分的小窗口都是一个框架，而这些框架的集合，就称为框架网页。 (二)框架网页的设计 1(单击上部横幅框架的“新建网页”按钮，在编辑区内首先插入装饰图片，然后输入饭店中英文名称，字号为,，中文为宋体，英文为行楷，设置背景色为,,,(,,，,,，,,)。 2(编辑左下部框架，首先在顶部插入饭店的地图，接着输入该饭店的介绍性文字，为,号宋体，颜色为,,,(,,，,,，,,) ,、编辑右下部框架，插入一个格，设定“表格属性”，“对其方式”为“居中”，“单元格边距”为,，边框颜色为白色。 ,、设置单元格背景色，第一列前三格的背景色分别为土黄色、明黄色、绿色，第二列背景色全部设为浅灰肥，输入文字，选择,号宋体。 ,、按照同样的方法完成表格的输入，预览整个网页。 (三)框架网页的保存 1(单击“保存”按钮，出现“另存为”对话框，此时在预览区整个框架图都处于高 亮状态。 2(单击“确定”后，开始保存标框架，此时在预览区标题框架处于高亮状态。 3(按照上面的方法，依次保存所有的框架后，就完成了整个框架网页的保存。 说明:对于每个框架都会依次单独进行保存 在例一的基础中，学习制作结构更为复杂的框架网页，在下例网页中，将大量地对基础框架进行改造，包括:框架的拆分、删除、边框的设置等 二、复杂的框架网页——青青校园 (一)框架的拆分 1(单击“文件”——“新建”，选择“网页”，在出现的“网页模板”中，切换到“框架”选项卡，双击“横幅和目录”框架模板，建立一个空白网页。 2(选择要拆分的对象，，从“框架”菜单中选择“拆分框架” (具体讲解如何进行拆分框架) (二)网页的编辑 1(编辑标题框架，首先输入网站的名称，6号字，华文彩云字体，深蓝色，效果选“加强”，其次插入宣传图片;背景设为浅蓝色 2(编辑标题下方的菜单条框架，输入校内站点名称，具体进行设置 3(将左上部框架制成用户登录区，首先插入2*2表格，在表格第一列中输入“用户名”和“密码”字样，2号;第二列插入两个单行文本框，最后插入登陆和注册按钮 4(将右下部框架制成调查区，首先输入要调查的问题，然后插入4*2表格，在第一列插入表单选项中“选项按钮”，第二列输入文字选项，背景蓝色 5(在中上部的框架内，单元格背景色设为蓝色。单击工具栏上的“插入表格”按钮，移动鼠标选择一个4*3的表格 6(选中表格的第一行，单击“表格工具栏”上的“合并单元格”按钮，第一行变为一个独立的单元格，将其背景设为灰色，输入焦点新闻的标题，选用蓝色黑体 7(选中表格的第一列，单击“表格工具栏”上的“合并单元格”按钮，第一行变为一个独立的单元格，在其中插入图片 8(在另外的表格内输入新闻宋体3号黄色字 9将光标移动到左下部框架内，单击“常用工具栏”上的“插入图片”按钮，在出现的“图片”对话框中选择图片文件，即可插入图片，在图片的下部输入文字 10(右键之间单击上部框架，在快捷菜单中选择“框架属性”， 在“框架属性”对话框中，单击“框架网页”按钮，出现“网页属性”对话框，取消“显示边框”的选项 小结:建立一个框架网页的过程分为两部分，一是决定其结构，即将其拆分不同的区域，二是为每个区域设计相应的内容。在具体的调整框架的大小，从而对网页的布局进行细致的调整，可以通过手动方式和菜单方式。