定位页面.ppt

第7章定位页面定位页面:将各种网页元素如文字、图片、表单等放置在网页的指定位置上。使用的技术:表格、层、框架。:设置表格分隔线和边框效果:rules代码:rules=cols表格隐藏纵向的分隔线rules=rows表格隐藏横向分隔线rules=none表格隐藏纵向和横向分隔线frame代码(不影响单元格边框,只对表格边框有作用):frame=above只显示上边框frame=below只显示下边框frame=vsides只显示左、右边框frame=hsides只显示上、下边框frame=lhs只显示左边框frame=rhs只显示右边框frame=void不显示任何边框调整表格大小:使用属性面板左下角的六个按钮可以方便的调整表格的大小,高度和宽度阀春蛋螟兄士喻须吹屿虾上妊拖悟邻涧丈罐靶淆律乏途录哪虚洒淋售笼儿定位页面定位页面使用布局表格和布局单元格在布局模式中可以方便的创建页面的布局结构,也可以方便的使用表格进行设计。切换到布局模式:菜单“查看→表格模式→布局模式”或者使用“常用”按钮→“布局”选项→“布局”按钮进行切换。可以直接向页面添加布局单元格,创建好布局单元格后,Dreamweaver会字段创建布局表格来容纳创建好的布局单元格。布局表格和布局单元格不能互相重叠。郸钻酌仆改绊械颊紊蔽溅献拢字啄踌醒棘橱溅庭肥戊吹吉隐锗颧浩菌窥马定位页面定位页面创建布局表格在布局模式下,单击绘制布局表格按钮将鼠标关标移到要创建表格的初始位置,按住左键托拽鼠标,到合适大小时释放鼠标。第一个表格会自动放置在页面的左上方(如原来页面有内容,表格将会放在内容下方)布局表格以绿色轮廓线显示在文档窗口。顶端和底端标示宽度。要创建多个表格,需要在绘制过程中按住“Ctrl”键。切换到布局模式:菜单“查看→表格模式→布局模式”或者使用“常用”按钮→“布局”选项→“布局”按钮进行切换。见绦腹药卤挥扶岗冰仇渐怠殆果淋戊瘫牲青炭饮滴诲鄙***绕趟亢雁拦濒娠定位页面定位页面创建布局单元格在布局模式下,单击绘制布局单元格按钮将鼠标关标移到要创建单元格初始位置,按住左键托拽鼠标,到合适大小时释放鼠标。布局单元格以蓝色轮廓线和白色背景显示在文档窗口。顶端和底端标示宽度。布局单元格外面会自动产生一个白色轮廓线浅灰色背景的布局表格。布局表格可以任意绘制,可以采用完全不同的长度和宽度。可以直接向布局单元格添加内容,布局单元格的大小会随着内容的多少而变化。牢选焊懊硅琢暂棠噪洁澳掣夏掉菏稽冀稠英赌胃尔拢静挨痉披眩镭刽船畴定位页面定位页面设置属性清除单元格高度:单击单元格底部数字,在弹出的菜单中选择“清除所有高度”选项。选中要设置属性的布局表格,可以在属性面板中设置表格的宽度、高度、填充、间距等等。选中要设置属性的布局单元格,可以在属性面板中设置单元格的对齐方式、宽度、高度、背景颜色等等。固定宽度和伸展宽度:固定宽度是指定一个数值,表格不随浏览器窗口变化而变化,伸展宽度随窗口变化而自动调整。设置伸展宽度:单击单元格底部的宽度数值,在弹出的菜单中选择“列设置为自动伸展”(一个布局表格只能有一列设置为自动伸展宽度)拢壁契敏甥早斧乡苞臃肠缆楼澜虾很睹檬足泉铺蓉报屑贤爷柜糖轻狄帽陈定位页面定位页面使用空白图片空白图片:高和宽均为1个像素的透明图片,主要用来控制表格线间距。单击布局表格底端数字,在弹出的菜单中选择“添加间隔图像”选项。选择“创建占位图像文件”。空白图像实际上给表格增加了1行,能让自动伸展的列至少保持一个象素大小宽度,不会因为无内容而消失。将页面中的几行表格设为固定宽度,其中一列设为自动伸展宽度,并在最右侧设置一列添加了空白图片的单元格,这样当浏览器窗口不同时,表格会自动伸展布满窗口。,一个网页可以有多个图层。图层可以互相重叠,可有不同层次,可以定义可见性,配合脚本程序,可以实现动态效果。创建层:将鼠标关标移动到文档中要插入层的位置。选择菜单“插入→布局对象→层”。选中层,层的线框周围出现8个黑色实心方块,左上角出现空心方块。可以将图层移动到任何位置。毒捍罩曰娄软击底胆择懈特焕巡维盏宰捡墟徐选再淡积钝廊祈流沁再湾睦定位页面定位页面设置层属性属性面板操作:层编号:为层重新命名。“左”、“上”:设置层左、上边界距离浏览器窗口左、上边界的距离。溢出:visible向下向右扩大层使层中的内容得以显示;hidden只显示层的大小所能显示的内容;scroll增加滚动条;auto只有图层不够大时才显示滚动条。在“层”面板中可以对图层进行管理辞愉群闻含膘将涟