网页设计　全套课件.PPTVIP

第2章 HTML语言基础 主要内容 2.1 HTML文档的基本结构 2.2 文本格式应用 2.3 超链接 2.4 多媒体元素应用 2.5 表格 2.6 表单 2.1 HTML文档的基本结构 HTML是Hypertext Markup Language（超文本标记语言）的缩写，是一种为普通文件中某些字句加上标识的语言，其目的在于运用标记（tag）对文件达到预期的效果。 它是构成Web页面（Page），用来表示Web页面的符号标记语言。 通过HTML，将所需要表达的信息按某种规则写成HTML文件，通过专用的浏览器来识别，并将这些HTML文件翻译成可以识别的信息，就是所见到的网页。 标记及其属性 1.标记 HTML文档由标记和被标记的内容组成。标记（tag）能产生所需的各种效果。格式为： 标记 受标记影响的内容 /标记 例如，标题标记title表示为： title 我的第一个网页 /title 2. 标记的属性 标记只是规定这是什么信息，或是文本，或是图片，但怎样显示或控制这些信息，就需要在标记后面加上相关的属性来表示，每个标记有一系列的属性。格式为： 标记 属性1=属性值1 属性2=属性值2 … 受影响的内容 /标记 例如，字体标记font有属性size和color等。 font size=3 color=red 属性示例 /font HTML的基本结构 HTML文档是一种纯文本格式的文件，HTML文档的基本结构为： html head title 网页的标题，显示在浏览器标题栏 /title /head body 这是网页上显示的内容，网页的主体部分 /body /html HTML文档的编辑 ① 打开记事本。 ② 编辑HTML文档。按照HTML语法规则编辑内容。 ③ 保存HTML文档。 ④ 浏览HTML文档。 2.2 文本格式应用 文本段落格式 文字的显示效果 列表格式 文本段落格式-1 1.注释标记!--...-- 格式为： !-- 注释内容 -- 注释并不局限于一行，长度不受限制。结束标记与开始标记可以不在一行上。 2.换行标记br和不换行标记nobr…/nobr br放在一行的末尾，可以使后面的文字、图片、表格等显示于下一行，而又不会在行与行之间留下空行，即强制文本换行。强制换行标记的格式为： 文字 br 不换行标记可令文字不能因太长使浏览器无法显示而换行，它对住址、数学公式、一行数字等尤其有用。其格式为： nobr 文字 /nobr 文本段落格式-2 3.段落标记p.../p 分段标记放在一个段落的头尾，用于定义一个段落。 p…/p标记不但使标记的文本文字独立成为一段，还可以使段与段之间显示效果上多空一行。 格式为： p align=”left | center | right”文字/p 属性align用来设置段落在页面中的水平对齐方式。其中left为默认取值，表示左对齐；center表示居中对齐；right表示右对齐。 文本段落格式-3 4. 标题标记hn…/hn 标题是一段文字的核心，一般总是用加强的效果来突出显示。网页中的信息可以根据主次不同设置不停大小的标题，为文章增加条理。 HTML文档中应用Hn标记，浏览器会自动将字体解释成“黑体”，同时将内容设置为一个段落。 格式为： hn align=”left | center | right”标题文字/hn n用来表示标题文字的大小，n取1～6的整数，取1时文字最大，取6时文字最小。 属性align用来设置标题在页面中的水平对齐方式。其中left为默认取值，表示左对齐；center表示居中对齐；right表示右对齐。 文本段落格式-4 5. 分节标记div…/div 分节标记div就是用来设定文字、图像、表格的摆放位置的。 格式为： div align=”left | center | right”文本、图像或表格/div 属性align是用来设置文本块、一段文字或标题在网页上的对齐方式的。其中left为默认取值，表示左对齐；center表示居中对齐；right表示右对齐。 文本段落格式-5 6.水平线标记hr 在网页页面中添加水平标尺线（Horizontal Rules），可以是不同功能的文字分隔开，起到修饰页面的作用。 格式为： hr align=”left | center | right” size=”水平线粗细” w