Dreamweaver CS6实例

您所在的位置:网站首页 的简单个人介绍 Dreamweaver CS6实例

Dreamweaver CS6实例

2024-07-13 11:54| 来源: 网络整理| 查看: 265

操作步骤

        1.打开Dreamweaver CS6软件,并执行文件、新建命令在页面类型中选择HTML创建HTML页面,如下图所示。

        2.在窗口界面的菜单栏中点击插入、页面属性,选择外观(CSS)视图,在字体“大小”下拉列表框中选择12,并设置页面边距均为0,点击确定按钮,完成页面属性设置。如下图所示。

 

 

        3.先将“输入光标”选定在“标签body”中,之后在窗口界面的菜单栏中点击插入、表格,设置行数为8、列数为2、表格宽度为800(单位为像素)、边框粗细为1、单元格边距为0、单元格间距为6、标题为无,点击确定按钮,完成表格的设置。如下图所示。

 

        4.在窗口界面点击代码部分中的“table”标签,在页面下方显示的属性栏中设置对齐方式为“居中对齐”,将插入的表格居中对齐。如下图所示。

 

        5.在窗口界面的表格标签table内容中,一个完整的“ ”标签代表1行,一个完整的“ ”标签表示1列。

        用鼠标点击第1行第1列的标签前,页面下方会显示出该列的属性栏,在“背景颜色”中输入“#6699FF”;之后选择第1行第2列的标签前在显示的属性栏中输入背景颜色值“#339900”;之后按照同样的方法分别设置第4行1、2列背景颜色分别为“#663300、#FFFFCC”,第7行1、2列背景颜色分别为“#CCFFFF、#FFFFCC”,第8行1、2列背景颜色分别为“#CCCCFF、#FFDDDD”。如下图所示。

        6.在窗口界面的表格标签table内容中,一个完整的“ ”标签代表1行,一个完整的“ ”标签表示1列。

        选中第2行第1列的标签中的信息“ ”并输入文字“∵基本信息”,之后选中“∵基本信息”在下方属性栏中点击加粗按钮,文字被包含在标签“”中。同理,将第2行第2列,第6行第1、2列分别输入“∵兴趣爱好、∵学习经历、∵获得奖项”,并且加粗文字,加粗方法相同。如下图所示。

 

 

        7.在窗口界面的表格标签table内容中,一个完整的“ ”标签代表1行,一个完整的“ ”标签表示1列。

        鼠标点击第1行第1列的标签前空白处,之后在下方属性栏中点击标签,设置高为12。同理,设置第3行、第7行高为2。如下图所示。

        8.在窗口界面的表格标签table内容中,一个完整的“ ”标签代表1行,一个完整的“ ”标签表示1列。

        在第4行和第8行输入的各个单元格中输入信息,每输入一行创建一个用于换行。并选择“[email protected]”和“http://www.user001.com.cn”在属性栏中设置相应属性,如下图所示。

 

代码实现

        提示:编译环境采用的是“Dreamweaver CS6”,如果是更高版本DW软件,可以只选取标签“   ”中的内容,其余部分采用软件打开时自给的信息。

DW CS6实例测试 body,td,th { font-size: 12px; } body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } ∵基本信息 ∵兴趣爱好 姓名:张军, 性别:男 出生日期:1988年12月 电子邮箱:[email protected] 个人主页:http://www.user001.com.cn 手机号码:138138000123 体育方面:乒乓球、游泳 音乐方面:弹钢琴、唱歌 技术方面:软件开发、动画制作 阅读方面:推理小说、散文 ∵学习经历 ∵获得奖项 本科:南京信息工程大学 计算机与软件学院 硕士:南京大学 软件工程 2008年9月,校软件设计大赛一等奖。 2009年3月,学院课件设计比赛一等奖。 2010年5月,省科技创新大赛二等奖。 运行效果

        提示:表格部分可以进一步修改,根据你所需要的行、列数以及表格属性进行设置即可。 

写在最后:

        读两遍下来,如果仍然有不清楚的地方,可在评论区留言。

        如果你有其他感到困惑的问题,欢迎留言。

 



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3