logo

您所在位置网站首页 > 海量文档  > 计算机 > Web服务

《WEB前端开发实用案例教程》单元5 通讯录分组表—表格构建网页.pptx 39页

本文档一共被下载: ,您可全文免费在线阅读后下载本文档。

  • 支付并下载
  • 收藏该文档
  • 百度一下本文档
  • 修改文档简介
全屏预览

下载提示

1.本站不保证该用户上传的文档完整性,不预览、不比对内容而直接下载产生的反悔问题本站不予受理。
2.该文档所得收入(下载+内容+预览三)归上传者、原创者。
3.登录后可充值,立即自动返金币,充值渠道很便利
《WEB前端开发实用案例教程》 第五单元 通讯录分组表 ——表格构建网页 常用表格对网页中元素定位,将复杂的元素有条理的分布到网页各个位置,当我们把表格的宽度定位固定像素值后,还能保证网页布局不会随浏览器窗口的大小变化而变化,当我们在表格输入文字时,可以让文字满格后自动换行,方便对文字的编辑。 教学目标: 掌握使用表格布局网页 灵活掌握表格调整的方法 能够合理利用表格对网页进行布局和规划 目录页/Contents 01 任务 1 月历制作——表格标签的灵活应用 02 任务 2 用户信息统计页面——CSS设置边框及内外边距 知识储备 01 任务1 月历制作——表格标签的灵活应用 【知识储备】 1. 表格的HTML标签 与其他HTML元素一样,表格也是由标签组成的。 1)表格主体标签<table> <table></table>标签对为表格的主体标签,表格的其他组成元素,如行标签、单元格标签等都包含在<table></table>标签对之间。 2)行标签<tr> <tr></tr>标签对为表格的行标签,表格有多少行,就有多少个<tr></tr>标签对。在每行中可以包含多个单元格。 3)单元格标签<td> <td></td>标签对为表格的单元格标签,其包含在<tr></tr>标签对中。单元格用于存放表格要显示的内容,可以是任意的HTML内容,这些内容位于<td></td>标签对之间。在表格的一行中可以包含多个单元格。 任务1 月历制作——表格标签的灵活应用 【知识储备】 4)表头标签<th> <th></th>标签对为表格特有的表示表头单元格的标签,在Dreamweaver的设计界面中创建表格时可以选择表头所在的位置。scope为<th>标签的属性,表示定义表头,"col"为属性值,表示将当前列的所有单元格和表头单元格联系起来。 5)标题标签<caption> <caption></caption>标签对为table表格特有的表示标题的标签,同<th>标签不同的是,<caption>标签不需要合并,它本身就只有一列,同时<caption>标签的位置是默认居中的。 任务1 月历制作——表格标签的灵活应用 【知识储备】 2. 合并和拆分单元格 要合并单元格,可先选中要合并的多个单元格,然后单击属性检查器中的“合并单元格”按钮;要拆分单元格,可将插入点置于要拆分的单元格中,然后单击属性检查器中的“拆分单元格”按钮,在弹出的对话框中选择需要拆分为的单元格类型,并输入要拆分为的行数和列数,然后单击“确定”按钮即可。 在Dreamweaver的设计界面中,在要选择的单元格上拖动鼠标可选中相应的单元格;按住Ctrl键依次单击要选择的单元格,也可同时选中多个单元格;单击网页文档底部状态栏中的相应标签 ,可选中整个表格,或选中插入点所在的行或单元格,应用见图5-1所示的表格属性。

发表评论

请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码: 点击我更换图片

“原创力文档”前称为“文档投稿赚钱网”,本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有【成交的100%(原创)】。原创力文档是网络服务平台方,若您的权利被侵害,侵权客服QQ:3005833200 电话:19940600175 欢迎举报,上传者QQ群:784321556