1002-网页设计.pptVIP

学习目标 HTML的概念及基本结构 网页文字设置 网页图像设置 HTML的概念 HTML的英语意思是：Hypertext Marked Language，即超文本标记语言,是一种用来制作超文本文档的简单标记语言。 超文本传输协议规定了浏览器在运行 HTML 文档时所遵循的规则和进行的操作. HTML只是一个纯文本文件。创建一个HTML文档，只需要两个工具，一个是HTML编辑器，一个WEB浏览器。HTML编辑器是用于生成和保存HTML文档的应用程序。WEB浏览器是用来打开WEB网页文件，提供给我们查看WEB资源的客户端程序。 HTML的标签与属性 “”和 “/”括起来的句子，我们称它为标签，是用来分割和标签文本的元素，以形成文本的布局、文字的格式及五彩缤纷的画面。标签通过指定某块信息为段落或标题等来标识文档某个部件。 HTML的标签分单标签和成对标签两种。 HTML的标签与属性 属性是标识里的参数的选项，作用是进一步控制文件的内容,如文字的大小、颜色等。 标签名字 属性1=“属性值1” 属性2=“属性值2 属性3 … 内容/标签名字 font color=#ff00ff face=宋体 size=30字体设置/font 网页制作入门 2.1 Dreamweaver 基本操作 1 、 Dreamweaver 的工作环境 (3)“属性”面板 4、 网页的基本操作 1）新建网页 “【文件】→【新建】”菜单命令 2）打开网页 “【文件】→【打开】”菜单命令 3）保存文档 “【文件】→【保存】”菜单命令 5、 创建和管理站点 所谓站点，可以看作是一系列文档的组合，这些文档之间通过各种链接关联起来，可能拥有相似的属性。站点实际对应的是一个文件夹，我们设计的所有网页就保存在这个站点（文件夹）中，存储在本地机器中的站点（文件夹）称为本地站点，发布到WEB服务器上的站点（文件夹），则称为远程站点。 创建本地站点 1) 规划： 在F盘新建文件夹，作为整个站点内容的文件夹，也是网站的根目录。 命名网站，分栏目，将栏目内容分别存放在网站根目录下的对应文件夹里。 网站所有素材图像存放于根目录下的文件夹“image”中。 　网页的编辑 文本的插入及属性设置 图像的插入及属性设置 图文混排 图像的编辑。 文字版面的编辑 换行标签br 换段落标签p及属性 由p标签所标识的文字，代表同一个段落的文字 格式： PP ALIGN=参数 ALIGN是p标签的属性,属性有三个参数left,center,right. 居中对齐标签center 水平分隔线标签hr 标题文字标签hn hn标签用于设置网页中的标题文字，被设置的文字将以黑体或粗体的方式显示在网页中。 标题标签的格式：hn align=参数〉标题内容/hn 说明：hn标签是成对出现的，hn标签共分为六级，在h1.../h1之间的文字就是第一级标题，是最大最粗的标题； 文字版面的编辑 文字格式控制标签FONT FONT标签用于控制文字的字体，大小和颜色。控制方式是利用属性设置得以实现的。 格式：font face=值1 size=值2 color=值3〉文字 /font 说明：如果用户的系统中没有face属性所指的字体，则将使用默认字体。size属性的取值为1~7。也可以用+或-来设定字号的相对值。color属性的值为：rgb颜色#nnnnnn或颜色的名称。 网页文字设置 插入文本 格式化文本 项目列表的应用 文本的格式设置 Dreamweaver 文字格式化主要有三种方式： 手工格式化方式 用HTML标记格式化方式 CSS样式 　文本换行 Enter→分段（隔一行） Shift+Enter→换行（不分段） 图像处理 浏览器可以显示的图像格式有jpg,bmp,gif,png。 bmp文件存储空间大，传输慢，不提倡用， jpg图像支持数百万种颜色，即使在传输过程中丢失数据，也不会在质量上有明显的不同， gif图像仅包括265色彩，虽然质量上没有jpg图像高，但占位储存空间小，下载速度最快、支持动画效果及背景色透明等特点。因此使用图像美画页面可视情况而决定使用那种格式。 PNG全称为：“可移植性网络图像”，是一种尺寸比GIF小30%的无损压缩图像文件 背景图像的设定 body background= image-url 网页中插入图片标签img 网页中插入图片用单标签img，当浏览器读取到img标签时，就会显示此标签所设定的图像。 　网页图片的插入与属性设置 网页图像格式 GIF→对色彩要求不高的地方可使用 JPEG