第4章页面元素布局设计题材.ppt

第4章页面元素定位技术 ;目录;4 页面元素定位技术 ;4.1 用表格定位页面元素 ;4.1.1 关于表格;4.1.2 表格的基本操作 ;4.1.2 使用表格定位页面元素;4.1.3 表格的属性设置;4.1.4 使用表格定位页面元素;图1 表格布局页面元素;4.1.5 归纳与思考;4.1.6 应用技巧与常见错误 ;4.2 使用层定位页面元素 ;4.2.1 关于层 ;4.2.2层的基本操作;4.2.2层的基本操作;4.2.3层面板的基本操作;4.2.3层面板的基本操作;4.2.3层面板的基本操作;4.2.4层定位页面元素;;4.2.5 归纳与思考 ;4.2.6 应用技巧与常见错误 ;4.3 框架布局页面元素;4.3.1 关于框架页面;4.3.2 一般框架布局页面元素;4.3.2 一般框架布局页面元素;4.3.2 一般框架布局页面元素;4.3.3浮动框架布局页面元素 ;浮动框架其常用属性如下表 ;创建一个没有框架的网页，如下图;将光标定位在右边的单元格中，单击”插入记录”“HTML”“框架”，选择”IFRAME”选项，此时，视图切换到”代码”视图状态，代码中光标所在的位置出现一对iframe/iframe标签，如下图。 ;将光标定位在起始iframe标签中，按空格键在弹出的列表项中选择”width”项，并设置width的值为606，width代表浮动框架的宽度。类似方法还可以设置name、height和src等属性，完成后的代码如下。 iframe name=“ifm” align=“middle” frameborder=“1” scrolling=“auto” width=“606” height=“311” src=“main.html”/iframe。 ;用鼠标选择左边表格中的”系部概况”文本，设置超链接至xbgk.html，在”目标”文本域中输入浮动框架的名称”ifm”。然后再选中”机构设置”文本，同理设置超链接至jgsz.html，在”目标”文本域中输入浮动框架的名称”ifm”。保存网页，按F12在浏览器中浏览，如下图。 ;;当单击”系部概况”链接时会发现xbgk.html页面会出现在名称为”ifm”的浮动框架中，如下图所示。 ;本章内容完！