HTML 头部元素

下文笔者讲述html头部元素的简介说明,如下所示

html头部元素简介

<head>元素:
    指所有头部元素的容器
<head>:
    内可包含脚本,样式表,脚本,元信息等 

head元素可包含内容

标签 备注
<head> 定义了文档的信息
<title> 定义了文档的标题
<base> 定义了页面链接标签的默认链接地址
<link> 定义了一个文档和外部资源之间的关系
<meta> 定义了HTML文档中的元数据
<script> 定义了客户端的脚本文件
<style> 定义了HTML文档的样式文件

HTML头部元素的示例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>HTML文档标题</title>
</head>
 
<body>
HTML文档内容......
</body>
 
</html>
HTML <base> 元素
<base> 标签描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接:

<head>
<base href="https://www.java265.com/images/" target="_blank">
</head>
HTML <link> 元素
<link> 标签定义了文档与外部资源之间的关系。

<link> 标签通常用于链接到样式表:

<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
HTML <style> 元素
<style> 标签定义了HTML文档的样式文件引用地址.

在<style> 元素中你也可以直接添加样式来渲染 HTML 文档:

<head>
<style type="text/css">
/*定义网页背景颜色*/
body {background-color:red}
p {color:green}
</style>
</head>

HTML <meta> 元素的示例

meta的功能

<meta> 标签提供
   元数据
   元数据也不显示在页面上
   但会被浏览器解析

META元素通常用于指定网页的描述
   关键词
   文件的最后修改时间
   作者
   和其他元数据。

元数据可以使用于浏览器(如何显示内容或重新加载页面)
 搜索引擎(关键词)
  或其他Web服务
例:
<meta> 通常放置于 <head> 区域。

<meta> 标签- 使用示例
为搜索引擎定义关键词(keywords):

<meta name="keywords" content="HTML, CSS, XML, XHTML, JS,PHP">
为网页定义描述内容(description):

<meta name="description" content="免费在线基础教程">
为网页定义手机端和PC端自适应(viewport):

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
定义网页作者(author):

<meta name="author" content="java265">
每10秒钟刷新当前页面(Refresh):

<meta http-equiv="refresh" content="10">