第03章 基本标签
3.1 HTML结构
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
<!DOCTYPE html>:是一个文档声明,表示这是一个HTML页面。
<html></html>:告诉浏览器,这个页面从<html>开始到</html>结束。
<head></head>:网页的头部,定义一些特殊的内容,如页面标题等。
<body></body>:网页的身体,大部分代码都在这个标签对内部编写。
3.2 head标签
在HTML中,一般来说,只有6个标签能放在head标签内。
分别是title、meta、link、style、script、base
1、标题标签:<title></title>
title标签唯一的作用就是定义网页的标题
<!DOCTYPE html>
<html>
<head>
<title>好好学习,天天向上</title>
</head>
<body>
</body>
</html>
2、<meta>标签
<meta>标签一般用于定义页面的特殊信息,例如页面关键字、页面描述等。
<meta>标签的两个属性:
name属性:keywords网页的关键字、description网页的描述信息、author网页的作者、copyright版权信息
http-equiv属性:定义网页所使用的编码;定义网页自动刷新跳转时间;
# 使用meta的http-equiv属性实现当前页面在6秒后会自动跳转到指定页面
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="refresh" content="6;url=http://www.baidu.com"/>
</head>
<body>
</body>
</html>
# 避免出现乱码,使用下面代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
</body>
</html>
3、style标签:<style></style>
style标签用于定义元素的CSS样式
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
</body>
</html>
4、script标签:<script></script>
在HTML中,script标签用于定义页面的JavaScript代码,也可以从外部导入JavaScript文件。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>
5、link标签:<link>
link标签用于引入外部样式文件(CSS文件)
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="css/index.css">
</head>
<body>
</body>
</html>
3.3 body标签
body标签:<body>主体内容</body>
# body标签表示页面的身体
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>body标签</title>
</head>
<body>
<h3>静夜思</h3>
<p>床前明月光,疑是地上霜。</p>
<p>举头望明月,低头思故乡。</p>
</body>
</html>
分析代码:
<meta charset="utf-8" /> 是防止页面出现乱码,放在<title>标签之前。
<h3></h3> 是一个第3级标题标签
<p></p> 是一个段落标签
3.4 HTML注释
注释标签:
注释标签:浏览器遇到注释标签会自动跳过,不会显示注释标签中的内容。
语法:
表示注释的结束
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>注释标签</title>
</head>
<body>
<h3>静夜思</h3>
<p>床前明月光,疑是地上霜。</p>
<p>举头望明月,低头思故乡。</p>
</body>
</html>