HTML入门
HTML入门
- 1_HTML结构
- 1.1_head标签
- 1.1.1_meta标签
- 2_文本
- 2.1_标题、段落、换行、文本、水平线、div标签
- 2.2_特殊符号
1_HTML结构
<!DOCTYPE html><!--文档声明，表示这是一个HTML页面-->
<html>
<head>
<meta charset="utf-8" />
<title>这是网页的标题</title>
</head>
<body>
</body>
</html>
1.1_head标签
在HTML中，一般来说，只有6个标签能放在head标签内。
（1）title标签
（2）meta标签
（3）link标签
（4）style标签
（5）script标签
（6）base标签
1.1.1_meta标签
在HTML中，meta标签有两个重要的属性：name和http-equiv。
1. name属性
表1 name属性取值
| 属性值 | 说明 |
|---|---|
| keywords | 网页的关键字，可以是多个，而不仅仅是一个 |
| description | 网页的描述 |
| author | author |
| copyright | 版权信息 |
举例：
<!DOCTYPE html>
<html>
<head>
<!--网页关键字-->
<meta name="keywords" content="绿叶学习网,前端开发,后端开发"/>
<!--网页描述-->
<meta name="description" content="绿叶学习网是一个最富有活力的Web技术学习网站"/>
<!--本页作者-->
<meta name="author" content="helicopter">
<!--版权声明-->
<meta name="copyright" content="本站所有教程均为原创，版权所有，禁止转载。否则必将追究法律责任。"/>
</head>
<body>
</body>
</html>
2. http-equiv属性
在HTML中，meta标签的http-equiv属性只有两个重要作用：定义网页所使用的编码、定义网页自动刷新跳转。
（1）定义网页所使用的的编码
语法：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
而在HTML5标准可以替换为：
<meta charset="utf-8" />
（2）定义网页自动刷新跳转
语法：
<meta http-equiv="refresh" content="6;url=http://www.baidu.com"/>
表示当前页面在6秒后会自动跳转到http://www.baidu.com这个页面
2_文本
2.1_标题、段落、换行、文本、水平线、div标签
1. 标题标签
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>标题标签</title>
</head>
<body>
<h1 align="center">这是一级标题</h1><!--align="center"使得标题居中-->
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
</body>
</html>
2. 段落标签
<p>段落内容</p>
3. 换行标签
自闭合标签
<br/>
4. 文本标签
在HTML中，我们可以使用“文本标签”来对文字进行修饰，例如粗体、斜体、上标、下标等。常用的有8种文本标签。
（1）粗体标签：strong、b
（2）斜体标签：i、em、cite（最好用em）
（3）上标标签：sup
（4）下标标签：sub
（5）中划线标签：s
（6）下划线标签：u
（7）大字号标签：big
（8）小字号标签：small
5. 水平线标签
<hr/>
6. div标签
在HTML中，我们可以使用“div标签”来划分HTML结构，从而配合CSS来整体控制某一块的样式。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>div标签</title>
</head>
<body>
<!--这是第一首诗-->
<div>
<h3>静夜思</h3>
<p>床前明月光，疑是地上霜。</p>
<p>举头望明月，低头思故乡。</p>
</div>
<hr/>
<!--这是第二首诗-->
<div>
<h3>春晓</h3>
<p>春眠不觉晓，处处闻啼鸟。</p>
<p>夜来风雨声，花落知多少。</p>
</div>
</body>
</html>
2.2_特殊符号
空格符号nbsp
特殊符号使用格式：
其他符号见此链接