网页设计与制作项目实训教程 教学课件 ppt 作者 严加琼 曾金发项目15.pptVIP

15.3 实践向导 任务15-4 流体网格布局 2.使用流体网格布局 　　 为了方便操作，可以将界面调整为“经典”模式，然后通过工具菜单新建网格。注意：默认页面上会有一些文字和一个DIV元素，可以删除它，但是不能把div class=gridContainer clearfix/div这部分DIV标记删除，否则流体网格将失去作用。单击按钮“插入流体网格布局标签”后，会询问是否新建一行（即是否作为块级元素），作为网页头部，一般都独占一行。将其命名为“top”后单击“确定“按钮。CS6会自动生成一个DIV标记的代码，并在其中用文字注明：这是布局 Div 标签“top”的内容。如图15-24所示。 图15-24 “插入流体网格布局Div标签”对话框 15.3 实践向导 任务15-4 流体网格布局 2.使用流体网格布局 　　用同样的方法再添加一个DIV，命名为“content”同样独占一行。而接下来的“interview”版块因为是多个分栏的情况，所以不能勾选“新建行”。建立之后会发现效果如图15-25所示，它表示这个Div并非当作传统块级元素处理： 注意：可以通过“可视化助理”来选择是否显示浅绿色的流体网格布局参考线，如图15-26所示 图15-25 流体网格非独占行 图15-26 可视化助理 15.3 实践向导 任务15-4 流体网格布局 2.使用流体网格布