网页设计网页元素定位技术.pptVIP

操作系统及网络应用技术 第一章 网站构建入门 第二章 网页基本内容设计 第三章 页面元素定位技术 第四章 样式应用 第五章 表单设计 第六章 流媒体及行为的应用 第七章 模板和库 第八章 服务器技术 第九章 网站的发布管理 主要内容 利用表格定位页面元素 插入表格 插入|表格 行数：输入新建表格的行数 列数：输入新建表格的列数 表格宽度：表格宽度，单位：像素百分比 边框粗细：表格边框的宽度 单元格边距：单元格内容和单元格边界之间的像素 单元格间距：单元格之间的像素数 页眉：可以定义表头样式 标题：定义表格的标题 对齐标题：定义表格标题的对齐方式 摘要：对表格进行注释 添加内容到单元格 编辑表格—选择表格及其元素 选择整个表格 选择指定单元格 单击table标记选择表格 编辑表格—调整表格和单元格大小 调整列宽 调整行高 调整表格宽 调整表格高 同时调整表格宽和高 编辑表格—添加和删除行列 编辑表格—拆分合并单元格 设置属性—设置整个表格属性 设置属性—设置行列单元格属性 练习 利用层定位页面元素 创建层 插入层：把光标放置文档窗口想要插入层的位置，选择 插入|层 拖放层：把绘制层的按钮从插入栏拖到文档窗口 绘制层：在插入栏中单击绘制层按钮，在文档窗口中拖拽 鼠标画出一个层 层基本操作—激活层 要在层中插入文字，图像，先要激活层 鼠标指针移至层内任何位置单击 插点置于层内，输入文字和图像 层基本操作—选择层 要对层进行移动，调整大小，先要选择层 选择一个层，选择多个层，shift 层基本操作—调整层大小，移动层 层基本操作—层属性设置 补充： 层的可见性 层的堆叠顺序 层和表格转换 练习 采用所给网页素材，利用层进行网页设计和布局 利用布局视图设计页面布局 选择左侧框架 左边保存为left.html 右边保存为fight.html 再创建几个要显示的字页面 设置超链接 运行时候再保存主框架 西南财经大学天府学院—计算机应用基础 * L o g o 西南财经大学天府学院Tianfu College of Southwestern University of Finance and Economics 信息技术中心 郭进 利用层定位页面元素 2 利用表格定位页面元素 1 利用布局视图设计页面布局 3 插入表格 编辑表格 设置属性 选择表格及其元素 调整表格单元格大小 添加和删除行和列 拆分单元格 合并单元格 设置表格属性 设置行列单元格属性 背景颜色：表格的背景颜色 背景图像：表格的背景图像 边框颜色：表格的边框颜色 填充：单元格内容和单元格之间的像素数 间距：相邻单元格之间的像素数 边框：设置表格边框的宽度 补充表格HTML标记 table width=200 border=1 tr tdnbsp;/td tdnbsp;/td /tr tr tdnbsp;/td tdnbsp;/td /tr tr tdnbsp;/td tdnbsp;/td /tr /table height width td tr table bgcolor bordercolor border 插入层 创建层 层基本操作 插入层 拖放层 绘制层 选择层 调整层大小 激活层 移动层 层属性设置 Ctrl +方向键可以对层进行微调大小 补充层HTML标记 div id=Layer2 style=position:absolute; left:459px; top:77px; width:302px; height:298px; z-index:2 西南财经大学天府学院—计算机应用基础