目录
HTML 初步认识
纯文本文件介绍
纯文本文件指的是仅包含文本内容,不存在样式,且使用记事本等纯文本编辑器打开时能够正常读取,不会出现乱码的文件。例如,html、css、js 都属于纯文本文件。
纯文本文件与其它文件的区别
txt 文件仅能保存文本内容,无法记录文本样式。而 doc 文件既能保存内容,又能保存样式。因此,存储相同的内容时,doc 文件通常比 txt 文件大。
Html介绍
HTML 是 “HyperText Markup Language” 的英文缩写,即超文本标记语言。
HTML 标签是分等级的,HTML 将所有的标签分为两类:容器级和文本级。容器级的标签内部可以放置任何元素;文本级的标签内部只能放置文字、图片、表单元素。
.html 是网页的常见格式。
当前业界的标准是,网页技术严格遵循三层分离:html 主要负责描述页面的语义;css 负责描述页面的样式;js 负责描述页面的动态效果。
HTML 骨架
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="Keywords" content="关键字 " />
<meta name="Description" content="描述 " />
<title>Document</title>
</head>
<body>
…
</body>
</html>
文档类型(!DOCTYPE)声明
介绍
DTD 即文档类型声明(Doc Type Declaration)。总共有 7 种 DTD,在 HTML4.01 中有三种<!DOCTYPE>声明,在 XHTML1.0 中也有三种<!DOCTYPE>声明,而在 HTML5 中仅有一种<!DOCTYPE>声明。XHTML 总体上比 HTML 更为严格,比如要求标签必须为小写字母、标签必须闭合、属性值必须带引号等。HTML4.01 兼容 ie6 及以上版本,HTML5 兼容 ie9 及以上版本。例如:
HTML4.01 :
strict(严格型):更为严格,不包括展示性的和弃用的元素(比如 font、u、b、i 标签),不允许框架集(Framesets)。
transitional(过渡型):相对不那么严格,不允许框架集(Framesets)。
frameset(框架集型):允许框架集(Framesets)。
XHTML1.0 :
strict(严格型):更为严格,不包括展示性的和弃用的元素(比如 font、u、b、i 标签),不允许框架集(Framesets)。
transitional(过渡型):相对不那么严格,不允许框架集(Framesets)。
frameset(框架集型):允许框架集(Framesets)。
常用的 DOCTYPE 声明
HTML4.01 :
Strict :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Transitional :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Frameset :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML1.0 :
Strict :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Transitional :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Frameset :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
HTML 5 :
<!DOCTYPE html>
备注:XHTML 1.1 :该 DTD 等同于 XHTML 1.0 Strict,但允许添加模型(例如提供对东亚语系的 ruby 支持)。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
meta标签
字符集
中文能够使用的字符集两种:
第一种:UTF-8
UTF-8 是国际通用字库,包含各种国家的语言,但保存尺寸较大,存储一个汉字需要3个字节。例如:新华网藏语频道使用的是 UTF-8,以保证字符集的丰富性。
第二种:gb2312(也可以写成 gbk)
gb2312 包含的字符较少,主要是中文、少数外语和符号,但尺寸较小,存储一个汉字只需 2 个字节。例如:部分网易的网页出于对显示速度的追求,或许会采用 GBK(或 GB2312)字符集。
UTF-8 和 gb2312 对比:
字符集 | 描述 |
UTF-8 | 字全,存储一个汉字所需3个字节。 |
gb2312 | 只用中文、少数外语和符号,存储一个汉字所需2个字节。 |
关键字和页面描述
<meta> 标签永远位于 <head> 元素内部,属于自封闭标签。
<meta name="Keywords" content="关键字 " />
<meta name="Description" content="描述 " />
meta 标签必须属性:
属性 | 值 | 描述 |
content | some_text | 定义与 http-equiv 或 name 属性相关的元信息 |
meta 标签可选属性:
属性 | 值 | 描述 |
http-equiv | content-type | 把 content 属性关联到 HTTP 头部。 |
expires | ||
refresh | ||
set-cookie | ||
name | author | 把content属性关联到一个名称。 |
description | ||
keywords | ||
generator | ||
revised | ||
others | ||
scheme | some_text | 定义用于翻译 content 属性值的格式。 |