网页设计与制作 p27.pptVIP

文档工具栏 状态栏 为什么要学 授课内容：HTML语言基础知识 CSS基本用法 Dreamweaver CS4使用方法 学习方法：兴趣，多记笔记，多练习 网站建设所需知识： 前端 HTML（基础） CSS（进阶） Javascript Ajax等（高级） 后台 php asp jsp等 数据库 一、HTML语言基础知识 HTML：即超文本标记语言是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。 包含HTML内容的文件最常用的扩展名是.html，可用任何文本编辑器编写 HTML基本语法 1.源代码都是由标记和内容组成。 2.标记是一系列使用 括号的代码，用于描述网页的格式和内容。 例如：B这段文字将在浏览器中显示为黑体字。/B 3.HTML中的标记都是成对出现的,即有一个开始标记和一个结束标记，结束标记与开始标记的不同之处是在 内有一个斜杠/“ 4.HTML中的标记 都具有属性和属性值 例如：FONT COLOR = BLUE这段文字是蓝色的/FONT 5.任何HTML文档都必须包含HTML，HEAD，BODY这三种元素 6. HEAD（文件头）和BODY（文件体）元素包含在HTML元素之间 HTML的骨干标记： HTML Head Title网页的标题/Title /HeadBody ... 这是用户可以看到的内容... /Body /HTML 一、字体的标记 h1 h2 h3 h4 h5 h6： 这些是标题标记，由h1至h6变粗变大加宽的程度逐渐减小。 font标记 font face=“Arial” size=“2” color=“#008000”  文本/font face=“Arial”：设定文字的字形 size=“2”：设定文字的大小 color= “#008000”：设定文字的颜色 二、排版标记 (1)p标记 (1)br标记 4、(1) hr： hr称为水平线，在网页中插入一条水平线。 (2)hr的参数设定：hr align=“left” size=“2” width=“70%” color=“#0000ff” noshade 1、无序列表： (1)代码： ul li无序列表项1/li li无序列表项2/li li无序列表项3/li  /ul 有序列表： (1)代码： ol li有序列表项1/li li有序列表项2/li li有序列表项3/li  /ol HTML中的图像标记： img src=“logo.gif” width=“100” height=“100” hspace=“5” vspace=“5” border=“2” align=“top” alt=“Logo of Home” lowsrc=“pre_logo.gif” 一、超级链接简介 a href=“index.html”加下划线的文字/a 超级链接指向何处： （1）指向Internet上的真实网站 如a href=“” （2）指向本地网上的文件 （3）指向邮箱 如a href=mailto:who@163.com或a href=mailto:who@163.com?subject=“hi” （4）其他，浏览器不能解释的文件：提供下载 锚点： （1）代码： 第一步：预先埋下锚点 a name=“anchor”/a 第二步：链接到锚点 a href=“#anchor”链接/a 文档的相对路径和绝对路径： (1)绝对路径 （2）相对路径： 文档的相对路径即为只包含当前文档的文件夹的路径。例如，current.html为当前文件夹下的文档；../top.html表示在当前文件夹的上一级文件夹中的文档； 一、表格概述 表格给Web页面带来了结构的概念。无论是用于电子表格的对齐数字功能还是在Web页面上的文本排版，HTML表格都使页面元素的排列更加有序。现在Web页面设计者已经把表格作为控制网页布局的最有力的工具，通过使用不带边框的表格，可以使页面中的所有对象整齐地排列。 1、table tr td： 这三个标记是定义表格的最重要的标记。 table是一个容器标记，意思是说它用以声明这是表格而且其他表格标记只能在它的范围内才适用。 tr用以标示表格行（r