Dreamweaver制作网页

《Dreamweaver制作网页》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第一讲网页边耐政湖南大学软件学院nbian@hnu.cn主题创建HTML页面创建HTML页面元素设定HTML的样式(CSS)目的利用Dreamweaver来可视化编辑HTML页面，并通过Dreamweaver来设定HTML的样式1新建HTML页面新建页面（1）点击HTML1新建HTML页面进入页面（1）页面图形化显示区域页面属性编辑区域快捷工具栏1新建HTML页面进入页面（2）模式切换按钮页面显示区域页面代码区域2建立HTML页面元素建立表格（1）单击插入/表格选择属性表格是HTML页面最重要的布局元素，其中对表格属性的处理尤为重要，如选择表格宽度时，我们可以

2、选择像素来固定表格的宽度或选择百分比来按比例扩大表格宽度2建立HTML页面元素建立表格（2）设定表格的属性自动生成的表格对应表格的属性对话框自动生成的代码2建立HTML页面元素建立表格（3）设定表格的属性指定表格的背景颜色自动生成的代码指定表格的对齐方式指定表格边框的属性表格的代码结构非常重要，自动生成固然很好，但是弄清每段代码更为重要2建立HTML页面元素建立表格（4）编辑表格单元的属性指定表格每行单元的背景颜色设定表格对象为居中对齐2建立HTML页面元素添加表单对象（1）（插入/表单/文本域）指定表单对象的属性选择类型2建立HTML页面元素添加表单对象（2

3、）设定相关对象的属性添加文本域添加单选按钮添加按钮添加密密码域3用CSS设定HTML的样式创建自己的CSS（1）打开右边的快捷工具栏，点开CSS可以看到类似的目录结构3用CSS设定HTML的样式创建自己的CSS（2）设定颜色为纯蓝现有CSS列表，我这里新建了一个.STYLE2的样式表.STYLE2下面的详细信息设定字体大小为18个像素CSS是设定页面样式的最好方式，这里只是介绍通过DW来创建自己的CSS样式，CSS的属性很多，这里只是简单的介绍一下3用CSS设定HTML的样式创建自己的CSS（3）.STYLE2样式表定义区间在你的HTML文件上部，会自动生成C

4、SS样式表的相关代码，当然如果你对CSS样式表的属性非常了解，你也可以自己手创作属性定义区3用CSS设定HTML的样式应用自己的CSS（1）选定要运用CSS样式的单元格(其它对象也可以)在改单元格的属性对话栏上点击样式，找到你想用的样式名称即可3用CSS设定HTML的样式应用自己的CSS（2）手工输入也可以自动调用自己已有的样式表运用.STYLE2的效果运用.STYLE3的效果3用CSS设定HTML的样式引用外部的CSS（3）去掉原有的样式表引用外部样式表Index.css样式表的内容这里添加了一个新的CSS属性，即页面的背景图片3用CSS设定HTML的样式引

5、用外部的CSS（4）新的样式表里的样式和原有的样式一样在样式表中所添加的背景引用外部的CSS样式表非常重要，在开发时，页面设计者不必顾虑太多页面的样式，通过引用外部的样式表，我们可以简化开发流程，并能够使网站的风格能够保持一致。4Dreamweaver浏览网页单击此按钮，选择此浏览器最后在浏览器中看到的画面5小结HTML中的表格和CSS是界面开发时最核心的东西，我们可以通过Dreamweaver轻松管理，大多数网站都可以通过table布局，通过调用外部的CSS来管理自己网站的风格，但是我们必须熟悉其中的基本元素，如table里的表格对象和CSS

6、里面的各种属性元素的含义等。我们只有熟悉了其基本的元素和属性，才能更加轻松灵活的开发我们的网站Q&AThanks