第6章网页布局new.pptVIP

《网页设计与制作》 6.3 应用Div+CSS布局网页 应用实例——利用Div+CSS布局网页框架 6.3.3 利用Div+CSS布局网页，首先需要设计页面的效果图，然后对页面结构进行分析。从图6-30所示的网页效果图可以看出，整个页面分为导航区域、头部区域、主体部分和底部区域。其中主体部分又分为左、中、右三列，整个页面居中显示。如图6-31所示。 《网页设计与制作》 6.3 应用Div+CSS布局网页 应用实例——利用Div+CSS布局网页框架 6.3.3 操作实例6-14 利用Div+CSS布局图6-31所示的网页框架 操作步骤： （1）搭建html框架代码 ①在站点窗口，新建网页文件index.html。将页面标题设置为“利用Div+CSS布局网页”。 ②设置Div插入点。在“代码”视图中，将光标定位在标签body与/body中间。 ③插入“导航区域”的Div标签“nav”。单击“布局”工具栏的“插入Div标签”按钮，打开“插入Div标签”对话框。设置“ID”为“nav”。如图6-32所示。 ·“插入”：下拉列表中的内容将根据插入点所在位置而发生变化，通过在下拉列表中选择不同选项，可以更精确地定位插入点的位置。 ·“类”：选择要应用于Div标签的类样式，如果要新建针对该Div标签的类样式，可以在“类”文本框输入样式名，然后单击“新建CSS规则”按钮定义类样式。 ·“ID