本篇教程教你如何用Dreamweaver掌握table表格布局方法,通过使用相关工具,学会表单标签及搜索框的应用,喜欢的一起来学习。
那我们开始今天的教程吧。
1.打开Dreamweaver,选择【新建】-【HTML】文件,【另存为】-【名称】:8.1.html,选择【保存】,具体如图所示。
2.修改文字【无标题文档】为【表格导航】, 在【<body></body>】中间插入文字【所有商品 首页 当季新品 潮流双肩包 手提旅行箱 8号会员日 免费加盟】,具体如图所示。
3.点击【<body></body>】中间空白处,选择【表格】-【行数】:1,【列】:7,【表格宽度】:950像素,选择【确定】,具体如图所示。
4. 选择【设计】,依次选择文本文字,【Ctrl】+【X】剪切,【Ctrl】+【V】复制到对应表格中,具体如图所示。
5.框选表格,选择【属性】-【宽】:135,【高】:30,选择所有文本,选择【属性】-【水平】-【居中对齐】,具体如图所示。
6.选择【<table>】-【Align】-【居中对齐】,选择表格,选择【属性】-【背景颜色】-【#3399CC】, 具体如图所示。
7. 选择单元格,选择【属性】-【拆分单元格】-【列】,【列数】:2,选择【确定】,具体如图所示。
8.选择右侧表格,输入【|】,选择【<td>】-【属性】-【宽度】:1,选择右侧表格,选择【属性】-【宽度】:137,依次选择其他表格,重复上述操作,具体如图所示。