资源描述
大家先了解一下,HTML的基本结构 HTML的基本语法 常用HTML标签,HTML结构,html标签每个文档必须使用，浏览器遇到开始解释，结束解释。 head部分用于对页面中使用的字符集、样式、窗口标题、脚本语言等进行说明和设置。 body部分是文档的主体，包含绝大部分html元素。,HTML的基本语法,标签 HTML通过标签文档的内容和外观，标签就是HTML的命令。 标签以开始，以结束 eg. 标签必须是闭合的。大部分成对出现，ex. 标签大小写无关。但建议html代码小写,HTML的基本语法,属性语法 属性的值需要在双引号中 属性名和属性值必须成对出现 属性语法 内容 Eg. 超文本,HTML常用基本标签,meta标签 在网页的HTML源代码中一个重要的代码“”（即通常所说的META标签）。META标签用来描述一个HTML网页文档的属性，例如作者、日期和时间、网页描述、关键词、页面刷新等。 文本标签 分隔标签 列表标签 超链接标签 图像标签,DW基本内容,Dreamweaver基本介绍 定义站点 设置文件头 使用文本 使用图像 使用Flash动画 使用音频 使用视频,About Dreamweaver,Dreamweaver是一款专业的 HTML 编辑器，用于对 Web 站点、Web 页和 Web应用程序进行设计、编码和开发。 Dreamweaver是Adobe(Macromedia)公司出品的一种专业化的网页创建工具,它采用所见即所得的编辑方式,通过特有的行为,模板,时间线等技术,能够快速高效地创建极具表现力和动感效果的网页,使网页创建过程变得简单.,DW设计网页的流程,整个网站的制作流程：在Photoshop或者Fireworks中作出效果图切图在Dreamweaver中添加文字，定义样式。 DW网站制作流程 新建站点站点文件命名定义页面属性插入表格定义页面大小转换到布局视图添加内容插入导航条转换到标准视图工作添加链接使用代码片断定义及应用CSS添加动态交互链接站点各个页面。,DW界面介绍,视图切换 代码提示 属性面板 标签选择器,定义站点,Why 避免错误的出现：路径错误，链接错误 HOW 1.建立一个文件夹用于存放网站的所有文件 2.再按栏目分类 (将图片放置在image文件夹中) 3.命名规则：使用英文或者拼音命名,网页文件的后缀名*.htm 或者*.html， 网站首页命名规则index.htm或者default.htm,设置文件头,1、meta标签说明 2、设置网页的编码 3、设置文档标题 4、定义关键字 5、设置说明文字 6、设置网页的刷新,meta标签说明,设置网页的编码,设置网页的编码,设置网页的编码,设置网页的编码,设置文档标题,+我的个人主页+,定义关键字,多个关键字用逗号分隔开来。 输入的关键字能反映专题的内容 关键字不宜太多，一般在5个以内。,设置说明文字,说明文字和关键字一样，可供搜索引擎寻找网页。 内容尽量要简明扼要。,设置网页的刷新,打开网站后的若干秒内，让浏览器自动跳转到一个新网页。 用于需要经常需要刷新的网页。 注意URL的输入,二、使用文本,、设置文本格式 、插入特殊符号 、段落与换行 、添加注释与空格 5、插入并设置水平线 6、设置段落缩进 7、使用列表,设置文本格式,标题标签 内容 #代表字体大小，取值16 align属性设置对齐方式，left center right 字体标签 内容,设置文本格式,设置文本格式,Dreamweaver CS4,Dreamweaver 8,文本属性设置窗口,设置颜色,颜色使用一个16进制的数值表示，如#FF0000，“#”是颜色标志。 任何一种颜色都是由红绿蓝3个颜色通道按不同亮度的比例混合而成。 前两位代表颜色中红色的亮度 中间两位代表绿色通道的亮度 后面两位代表蓝色的亮度。,插入特殊符号,段落与换行,段落换行：标记，直接enter键 换行符换行：，shift键+ enter键,添加注释与空格,添加注释 添加空格 输入代码 使用中文全角输入法,插入并设置水平线,语法： width 设置宽度，单位px size 设置厚度 ， color 设置颜色 align 设置对齐方式 noshae 设置是否需要阴影,使用列表,创建无序列表 创建有序列表 转换列表类型,三、使用图像,网页中的图像种类 图像的HTML标记 图片与文字的对齐方式 调整图片大小、替换图像、Alt属性 鼠标经过图像（Rollover Image） 简单的图文混排,网页中的图像种类,BMP（格式简单、图像信息丰富、不压缩） GIF（压缩比高、动画、像素图qq、256色） JPEG（压缩率极高、有损压缩、照片） PNG（透明显示、兼有gif和jpeg的色彩模式） 参考文献 web图像格式简述,图像的HTML标记,需要大家多练习,谢谢大家,
展开阅读全文