《商务网站规划与网页制作》06-03

机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社6.3使用层进行网页布局6.3.1层•层是一种能自由移动的载体，与表格相比，层的使用更加灵活。•使用层可以轻松地在网页的任意位置插入和放置内容，层也是一种网页元素的定位技术。•设计者可以控制多个层的叠放秩序、显示或隐藏层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社6.3.2创建和删除层●方法一：使用“插入”菜单创建层。●方法二：使用绘制层按钮绘制层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社1．插入层2．嵌套层嵌套层就是包含在另一个层中的层。嵌套通常用于将层组织在一起。嵌套层随其父层一起移动，并且可以设置为继承其父级的可见性。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社父层锚记子层锚记选择柄选择控制点子层父层嵌套层机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社3．选择层●方法一：在“层”面板中，单击该层的名称。●方法二：单击层的选择柄。●方法三：单击层的边框。●方法四：在一个层中按住Ctrl+Shift键并单击鼠标左键。●方法五：单击层所对应的层锚记。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社选择多个层可以使用如下两种方法：●方法一：在“层”面板中，按住Shift键并单击两个或更多的层名称。●方法二：在文档窗口中，按住Shift键并在两个或更多个层的边框内或边框上单击鼠标左键。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社4．删除层选中要删除的层，按Del键，即可将选中的层删除。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社6.3.3层的移动、调整和对齐1．移动层●方法一：通过鼠标拖动的方法来移动选中的层。●方法二：使用光标移动键来移动选中的层，一次移动一个像素。●方法三：按光标移动键时按住Shift键可按当前网格靠齐增量来移动层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社2．调整层的大小●方法一：通过拖动来调整大小，拖动层的任一选择控制点。●方法二：使用组合键来调整大小，Ctrl+光标移动键可一次调整一个像素的大小。这种方法只能通过移动层的右边框和下边框来调整层的大小，而不能通过移动层的上边框和左边框来调整层的大小。●方法三：使用Shift+Ctrl+光标移动键可按网格靠齐增量来调整大小。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社3．层的对齐使用层对齐命令可利用最后一个选定层的边框来对齐一个或多个层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社4．层的定位层的定位是指确定层与周围网页元素的位置关系•“绝对定位”是指将层放置在网页中的确定位置。采用绝对定位放置的层相对于网页的左上角位置是固定的。•“相对定位”可将层嵌入到表格或别的层中中。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社6.3.4设置层的属性使用属性检查器可以查看和设置层的属性。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社·层编号：用于指定一个名称，以便在“层”面板和JavaScript代码中标识该层。·左和上：指定层的左上角相对于所在框区左上角的位置。框区可能是页面、单元格或父层。·宽和高：指定层的宽度和高度。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社·Z轴：确定层的堆叠顺序。在浏览器中，编号较大的层出现在编号较小的层的前面。值可以为正，也可以为负。·可见性：指定该层最初是否是可见的。其中“默认”不指定可见性属性，而采用默认值，当不指定可见性时，大多数浏览器都会默认为“继承”；“继承”使用该层父级的可见性属性；“可见”显示这些层的内容，而不管父级的值是什么；“隐藏”隐藏这些层的内容，而不管父级的值是什么。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社•背景图像：指定层的背景图像。•背景颜色：指定层的背景颜色。•标签：指定用来定义该层的HTML标签。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社•溢出：控制当层的内容超过层的指定大小时如何在浏览器中显示层。其中“可见”指示在层中显示额外的内容；实际上，该层会通过延伸来容纳额外的内容。“隐藏”指定不在浏览器中显示额外的内容；“滚动”指定浏览器应在层上添加滚动条，而不管是否需要滚动条；“自动”使浏览器仅在层的内容超过其边界时才显示层的滚动条。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社•剪辑：定义层的可见区域。指定左侧、顶部、右侧和底边坐标可在层的坐标空间中定义一个矩形，从层的左上角开始计算。层经过“剪辑”后，只有指定的矩形区域才是可见的。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社本章小结•网页布局的常见形式通常有分栏式、区块式以及自由式三种，除了这三种典型的布局形式外，分栏式和区块式的混和布局也十分常见。•在设计网页布局时不必过于刻板，拘泥于这三种形式。•网页尺寸与分辨率有着密切的关系，设计时应根据客户群常用的分辨率来决定网页尺寸。•使用表格进行网页布局是最常见的布局方法。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社本章小结•使用布局表格进行网页布局更加得心应手。绘制布局表格和单元格必须在布局模式中进行。•是一种能自由移动的载体，与表格相比，层的使用更加灵活。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业《商务网站规划与网页制作》机械工业出版社本章小结•层的定位方式有两种，绝对定位和相对定位。•采用绝对定位放置的层相对于网页的左上角位置是固定的，而采用相对定位可以把层嵌入到表格或别的层中。•通过对层属性的设置，可以实现更加丰富的层的效果。