网页设计与制作项目式教程 教学课件 作者 凌云项目四 习题答案4.docVIP

《网页设计与制作项目化教程》习题参考答案 项目四 利用表格布局网站首页 任务一 利用表格规划页面 1.填空题 (1)“国”字型、拐角型、标题正文型、封面型、混合型。 (2)表格布局、DIV+CSS布局、框架布局 DIV+CSS布局 (3)0、0、0 (4)3 (5)固定的像素值、百分比 2.问答题 表格布局注意事项有： （1）不要把整个网页当成一个大表格，尽量使用分块。 （2）可以使用嵌套，但一般嵌套不宜超过三层，否则会影响浏览速度，而且在修改表格时，多层嵌套，导致代码过多，增加了修改的难度。 （3）作为布局的表格，表格线边框宽度一般设为0，单元格间距设为0，单元格填充距设为0。外表格宽度一般使用固定的像素值，嵌套的表格宽度可使用百分比，这样嵌套表格的宽度就能随被嵌套单元格宽度的变化而变化。 任务二 利用表格布局页面 1.填空题 （1）行、单元格 （2）ctrl+alt+t （3）默认、顶部、底部、左、右 （4）按字母排序、按数字排序 2.简答题 （1）首先，网页的布局很复杂，在最外层需要有一个表格控制总体布局。由于表格中同一行单元格的高度是一致的、同一列单元格的宽度是一致的，这时一些内部布局的细节也通过总表格来实现，容易引起行高列宽等的冲突，给表格制作带来困难。 其次，浏览器在解析网页的时候，是将整个表格的结构下载完毕之后才显示表格。如果不使用嵌套，表格非常复杂，浏览者要等待很长时间才能看到网页的内容。 出于这些原因，引入嵌套表格。由总表格负责整体的布局，由嵌套的表格负责各个子栏目的布局，并插入到总表格的相应位置中。这样一来各司其职，互不冲突。 （2）将product.txt文件中的表格导入Dreamweaver中。选择【文件】菜单，选择【导入】，单击【表格式数据】，打开【导入表格式数据】对话框，设置相关参数，【数据文件】为product.txt的文件路径，【分解符】为Tab，其他参数为默认参数，点击【确定】完成导入数据操作 任务三 完善表格布局 1.填空题 （1）表格中单元格内对象与单元格边框的距离、表格中单元格之间的距离 （2）单元格内的元素在单元格内垂直方向上的位置 顶端（top）、居中（middle）、底部（bottom）、基线（baseline） 2.简答题 表格布局的一般步骤是：根据由外向里、由整体到局部、自上而下、从左往右的原则依次创建表格、设置表格属性。 1）先创建外层表格，控制整个页面布局，设置表格及相关单元格的属性 2）根据需要操作表格进行拆分、合并操作 3）根据需要嵌套表格，并设置嵌套表格及相关单元格的属性 任务四 表格源代码 1.编程题 table width=551 height=174 border=1 cellpadding=0 cellspacing=2 bordercolor=#304A2F tr td height=45 colspan=5 align=center bgcolor=#CCFECB手机信息/td /tr tr td width=80 rowspan=4 align=center热门手机/td td width=120 height=30 align=center产品编号/td td width=120 align=center产品名称/td td width=140 align=center产品型号/td td align=center价格/td /tr tr td height=30 align=centerNO.001/td td align=center苹果/td td align=centerIphone4（8G）/td td align=center3500/td /tr tr td height=30 align=centerNO.002/td td align=centerHTC/td td align=centerG20/td td align=center2350/td /tr tr td height=30 align=centerNO.003/td td align=center三星/td td align=centerGalaxy siii/td td align=center4000/td /tr /table 第 2 页 共 2 页