HTML常用标签及CSS常用样式

一、HTML语言

1、什么是HTML语言

HTML（英文Hyper Text Markup Language的缩写）中文译为“超文本标签语言”，主要是通过HTML标签对网页中的文本、图片、声音等内容进行描述。

标签：标记的意思，在日常生活中，我们也经常会见到一些标记，例如交通规则的标记，告诉你应该怎样走。

而这里的标签就是告诉浏览器，在网页上显示什么内容，例如图片，文字，视频等。

文本：文字，那么什么是”超文本“，不仅可以显示文字，而且可以显示出图片，视频等，并且可以对文字，图片加上链接（所谓链接，就是单击一下，可以打开别的页面。）。

2、网页创建

了解了什么是HTML以后，怎样使用HTML编写网页呢？

先创建一个记事本文件，然后重命名，格式为.html。用记事本工具编写，比较麻烦，这里可以写一个标记，演示一下，同时也说清楚了什么是标记。

我们可以用一下其它的工具来编写，提供相应的代码提示。

2.1 常用工具

2.2 Html基本结构

说明：
1、标签的作用是所有HTML中标签的一个根节点。
2、 头部标签，在头部标签中我们必须设置的标签是

这个结构要记住。

注意：在使用sublime进行演示时，最开始敲完后不要敲回车键，否则会自动填充整个代码。

通过整个HTML结构我们可以看出来，标签之间都是有关系的。

2.3 标签关系

标签的相互关系就分为两种：
1
1.嵌套关系

1 2.并列关系 1 2 建议： 如果两个标签之间的关系是嵌套关系，子元素最好缩进一个tab键的身位。如果是并列关系，最好上下对齐。

我们发现在手敲上面的代码的时候，会比较麻烦，所以可以如下的快速输入方式：

再页面中输入 以下2个单词

1. html: 5
2. !
   在sublime里面然后按下tab键盘即可生成HTML骨架

参考地址：http://www.runoob.com/css/css-rwd-viewport.html

2.4 文档类型<!DOCTYPE>

1
这句话就是告诉我们使用哪个html版本？ 我们使用的是 html 5 的版本。 html有很多版本，那我们应该告诉用户和浏览器我们使用的版本号。

2.5 字符集

utf-8是目前最常用的字符集编码方式，常用的字符集编码方式还有gbk和gb2312。

gb2312 简单中文 包括6763个汉字

BIG5 繁体中文 港澳台等用

GBK包含全部中文字符 是GB2312的扩展，加入对繁体字的支持，兼容GB2312

UTF-8则包含全世界所有国家需要用到的字符

记住一点，以后我们统统使用UTF-8 字符集, 这样就避免出现字符集不统一而引起乱码的情况了。
1
二、HTML常用标签

我们学习HTML，最主要的就是用来学习标签

1、排版标签

排版标签主要和css搭配使用，显示网页结构的标签，是网页布局最常用的标签。

1.1 标题标签 (熟记)

我们经常会在页面中用到标题标签，HTML提供了6个等级的标题，即

和
用来修饰网页的主标题，
表示一个段落的标题，
表示段落的小节标题
标题标签语义： 作为标题使用，并且依据重要性递减

其基本语法格式如下：

标题文本

H1标签最常见的使用方法是用在logo上，如果我们要把H1标签使用在logo上，那么我们记得为图片添加alt标签以及a链接来指向首页，因为蜘蛛是无法识别图片的，所以我们要用alt标签来解释图片的意思。

1.2 段落标签( 熟记)

单词缩写： paragraph 段落

在网页中要把文字有条理地显示出来，离不开段落标签，就如同我们平常写文章一样，整个网页也可以分为若干个段落，而段落的标签就是

文本内容

1 是HTML文档中最常见的标签，默认情况下，文本在一个段落中会根据浏览器窗口的大小自动换行。

1.3 水平线标签(认识)

单词缩写： horizontal 横线

在网页中常常看到一些水平线将段落与段落之间隔开，使得文档结构清晰，层次分明。这些水平线可以通过插入图片实现，也可以简单地通过标签来完成，