网页设计1

HTML文档基本格式

1.<!DOCTYPE>标记

位于文档的最前面，用于向浏览器说明当前文档使用哪种HTML或XHTML标准规范。
必须在开头处使用<!DOCTYPE>标记为所有的XHTML文档指定XHTML版本和类型，只有这样浏览器才能将该网页作为有效的XHTML文档，并按指定的文档类型进行解析。

标记和浏览器的兼容性相关，删除，就是把如何展示HTML页面的权利交给浏览器。

2.< html>标记
< html>标记位于<!DOCTYPE>标记之后，也称为根标记，用于告知浏览器其自身是一个HTML文档，标记标志着HTML文档的开始, 标记标志着HTML文档的结束。
在它们之间的是文档的头部和主体内容。
在< html>之后有一串代码“xmlns=“http://www. w3.org/1999/xhtml””用于声明XHTMIL统一的默认命名空间。
3. < head>标记
< head>标记用于定义HTML文档的头部信息，也称为头部标记， 紧跟在 < html>标记之后。
主要用来封装其他位于文档头部的标记， HTML文档只能含有一对< head>标记。
4.< body>标记
< body >标记用于定义HTML文档所要显示的内容，也称为主体标记。浏览器中显示的所有文本、图像、音和视频等信息都必须位于< body>标记内，
一个HTML文档只能含有一对< body>标记，且< body>标记必须在< html>标记内，位于< head>头部标记之后，与< head>标记是并列关系.

HTML标记

在HTML页面中，带有“<>”符号的元素被称为HTML标记，
所谓标记就是放在“<>”标记符中表示某个功能的编码命令，也称为HTML标签或HTML元素。
1.单标记和双标记。
（1）双标记：也称体标记，是指由开始和结束两个标记符组成的标记。
基本语法格式：<标记名>内容</标记名>
(2)单标记：也称空标记，是指用一个标记符号即可完整地描述某个功能的标记。
基本语法格式：<标记名/>
2.< em>标记使某些文字显示为倾斜效果
< strong>标记使网页中其它的文本加粗显示。
3.注释标记
如果需要在HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字，就需要使用注释标记。
基本语法格式：< !–注释语句–>

标记的属性

基本语法格式：
<标记名 属性1=“属性1” 属性2=“属性值2”…>内容</标记名>
属性之间不分先后顺序，标记名与属性、属性与属性之间均以空格分开。
任何标记的属性都有默认值，省略该属性则取默认值。
书写HTML页面时，经常会在一对标记之间再定义其他的标记。
在HTML中，把这种标记间的包含关系称为标记的嵌套。
在嵌套结构中，HTML元素的样式总是遵从“就近原则”。

HTML文档头部相关标记

1.设置页面标题标记< title>
< title>标记用于定义HTML页面的标题，即给网页取一个名字，必须位于< head>标记之内。一个HTML文档只能含有一对< title>< /title>标记，< title>< /title>之间的内容将显示在浏览器窗口的标题栏中。
基本语法格式：< title>网页标题名称< /title>
2.定义页面元信息标记< meta/>
< meta/>标记用于定义页面的元信息，可重复出现在< head>头部标记中，在HTML中是一个单标记。< meta/>标记本身不包含任何内容，通过“名称/值”的形式成对地使用其属性可定义页面的相关参数。
< meta/>标记常用的几组设置：
（1）< meta name=“名称” content=“值”/>
设置网页关键字
设置网页描述
设置网页作者
(2)< meta http-equiv=“名称” content=“值”/>
设置字符集
设置页面自动刷新与跳转

3.引用外部文件标记< link>
一个页面允许使用多个< link>标记引用多个外部文件
基本格式：< link 属性=“属性值”/>
link标记的常用属性

属性名	常用属性值	描述
href	URL	指定引用外部文档的地址
real	stylesheet	指定当前文档与引用外部文档的关系，该属性值通常为stylesheet,表示定义一个外部样式表
type	text/javascript	引用外部文档的类型为JavaScript
type	text/css	引用外部文档的类型为CSS样式表

4.内嵌样式标记< style>
< style>标签用于为HTML文档定义样式信息，位于< head>头部标记中，
基本语法：< style 属性=“属性值”>样式内容< /style>
在HTML中使用style 标记时，常常定义其属性为type，相应的属性值为text/css，表示使用内嵌式的CSS样式

标题和段落标记

1.标题标记
HTML提供了6个等级的标题，即< h1>、< h2>、< h3>、< h4>、< h5>和< h6>
基本语法格式：< hn align=“对齐方式”>标题文本< /hn>
该语法中n的取值范围为1~6，align属性为可选属性，用于指定标题的对齐方式。
默认情况下标题文字是加粗左对齐，并且从< h1>到< h6>字号递减。
left:设置标题文字左对齐（默认值）
center：设置标题文字居中对齐
right：设置标题文字右对齐
2.段落标记
基本语法格式：< p align=“对齐方式”>段落文本< /p>
3.水平线标记< hr/>
基本语法格式：< hr 属性=“属性值”/>
< hr/>是单标记，在网页中输入一个< hr/>，就添加了一条默认样式的水平线。
< hr/>标记的常用属性

属性名	含义	属性值
align	设置水平线的对齐方式	可选择left、right、center三种值，默认为center，居中对齐
size	设置水平线的粗细	以像素为单位，默认为2像素
color	设置水平线的颜色	可用颜色名称、十六进制#RGB、rgb(r,g,b)
width	设置水平线的宽度	可以确定的像素值，也可以是浏览器窗口的百分比，默认为100%

4.换行标记< br/>
在HTML中，一个段落中的文字会从做到有一次排列，直到浏览器窗口的右端，然后自动换行。如果希望某段文本强制换行显示，就需要使用换行标记< br/>.

文本样式标记

HTML提供了文本样式标记< font>,用来控制网页中文本的字体、字号和颜色。
基本语法格式：< font 属性=“属性值”>文本内容< /font>
< font>标记的常用属性

属性名	含义
face	设置文字的字体，例如微软雅黑、黑体、宋体等
size	设置文字的大小，可以去1~7之间的整数值
color	设置文字的颜色

文本格式化标记

标记	显示效果
< b>< /b>和< strong>< /strong>	文字以粗体方式显示（XHTML推荐使用strong）
< i>< /i>和< em>< /em>	文字以斜体方式显示（XHTML推荐使用em）
< s>< /s>和< del>< /del>	文字以加删除线方式显示（XHTML推荐使用del）
< u>< /u>和< ins>< /ins>	文字以加下画线方式显示（XHTML不赞成使用u）

特殊字符标记