欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

9.HTML头部

程序员文章站 2022-05-07 17:18:33
...

HTML<head>元素

1.<head>元素中<title>元素

<title>元素是页面的标题,实例如下
<!DOCTYPE html>
<html>
	<head>
		<title>这是页面的标题</title>
	</head>
	<body>
		<p>浏览器中包含body元素的内容</p>
		<p>浏览器的标题中包含title元素的内容</p>
	</body>
</html>

<head>元素中的<base>标签

使用<base>单标签定义所有链接目标默认的地址
实例:

<!DOCTYPE html>
<html>
	<head>
		<title>这是标题</title>
		<base href="//A/B/C/" target="_blank" />
		<!--注意了,base是但标签-->
	</head>
	<body>
		<img src="1.png">
		<!--相当于src="//A/B/C/1/png",且由于base设置,所以target属性为
			_blank-->
	</body>
</html>

<head>元素中的<meta>元素(但标签)

使用<meta>元素来表述HTML文档的字符集,关键字,作者。实例如下:
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>这是标题</title>
		<meta name="description" content="免费在线教程">
		<meta name="keywords" content="HTML,Javascript,CSS">
		<meta name="author" content="YF">
	</head>
	<body>
		<p>注意了,head元素的所有内容都在页面标题上显示</p>
	</body>
</html>

HTML<title>元素

1.<title>元素定义了不同文档的标题。
2.<title>元素在HTML中是必须的
3.<title>元素是显示在搜索引擎页面的标题,也是显示在收藏夹中的标题,也定义了浏览器工具栏的标题

<!DOCTYPE html>
<html>
<head>
	<title>这是标题</title>
</head>
<body>

</body>
</html>

HTML<link>元素

1.<link>标签常常用于链接到样式表(CSS)
2.<link>标签是单标签
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

HTML<style>元素

HTML中<style>标签用于定义样式标签的引用地址
可以在<style>元素中直接添加样式来渲染HTML文档

<!DOCTYPE html>
<html>
	<head>
		<title>这是标题</title>
		<style type="text/css">
			body {
				background-color: yellow
			}
			p {
				color: blue
			}
		</style>
	</head>
	<body>
		<p>段落1号</p>
		<p>段落2号</p>
	</body>
</html>

9.HTML头部

HTML<meta>元素

HTML的<meta>元素描述了一些基本的元数据,元数据不显示在页面上,但是会被浏览器解析
<meta>元素提供了网页的描述,作者,关键词,文件的最后修改时间。
<meta>一般放于 <head>元素里面

HTML<script>元素

<script>标签用于加载脚本文件,如:JavaScript.
<script>会在以后的章节中描述

总结

<head>元素中常常包含的标签为:
1.<title>元素:定义了文档的标题
2.<base>元素:定义了文档中所有链接的基地址
3.<link>元素:定义了文档和外部资源之间的联系
4.<style>元素:定义了HTML文档的样式文件
5.<script>元素:定义了客户端的脚本文件
6.<meta>元素:定义了文档的元数据
相关标签: 前端学习