HTML 页面头部
时间:2019-06-08 23:19:24 来源:igfitidea点击:
一个典型的HTML文档将具有以下结构:
文档定义标签
<html>
<head>
文档标题相关标记
</head>
<body>
文档正文相关标记
</body>
</html>
<head>标记是各种重要标记的容器,如<title>、<meta>、<link>、<base>、<style>、<script>和<noscript>标记。
HTML <title>标签
HTML<title>标记用于指定HTML文档的标题。
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
<p>Hello, World!</p>
</body>
</html>
HTML <meta>标签
HTML<meta>标记用于提供有关HTML文档的元数据,其中包括有关页面过期、页面作者、关键字列表、页面描述等信息。
<!DOCTYPE html>
<html>
<head>
<title>HTML Meta标签示例</title>
<!-- 关键字列表 -->
<meta name = "keywords" content = "HTML, C++, Java, PHP, Perl, 之路教程">
<!-- 页面描述 -->
<meta name = "description" content = "在之路教程,可以学习各种编程语言">
<!-- 作者信息 -->
<meta name = "author" content = "theitroad">
<!-- 页面内容类型 -->
<meta http-equiv = "content-type" content = "text/html; charset = UTF-8">
<!-- 页面刷新延时 -->
<meta http-equiv = "refresh" content = "30">
<!-- 页面过期时间 -->
<meta http-equiv = "expires" content = "Wed, 11 June 2016 14:25:27 GMT">
<!-- 告诉机器人不要索引页面内容 -->
<meta name = "robots" content = "noindex, nofollow">
</head>
<body>
<p>Hello, World!</p>
</body>
</html>
HTML <base>标签
HTML <base>标记用于为页面中的所有相对URL指定基URL。
例如,在给定的URL前面加上基URL之后,所有其他URL将连接到http://www.theitroad.com/中。
<!DOCTYPE html>
<html>
<head>
<title>HTML Base Tag Example</title>
<base href = "https://www.theitroad.com/" />
</head>
<body>
<img src = "/static/images/logo.png" alt = "Logo图片"/>
<a href = "/html/index.html" title = "HTML教程">HTML教程</a>
</body>
</html>
链接URL变成
https://www.theitroad.com/static/images/logo.pnghttps://www.theitroad.com/html/index.html
HTML<link>标签
HTML<link>标记用于指定当前文档和外部资源之间的关系。
下面的示例链接到外部样式表文件 /css/style.css
<!DOCTYPE html>
<html>
<head>
<title>HTML link 链接</title>
<base href = "https://www.theitroad.com/" />
<link rel = "stylesheet" type = "text/css" href = "/css/style.css">
</head>
<body>
<p>Hello, World!</p>
</body>
</html>
HTML<style>标签
HTML<style>标记用于指定当前HTML文档的样式表。
<!DOCTYPE html>
<html>
<head>
<title>HTML style 标签示例</title>
<base href = "https://www.theitroad.com/" />
<style type = "text/css">
.myclass {
background-color: #aaa;
padding: 10px;
}
</style>
</head>
<body>
<p class = "myclass">Hello, World!</p>
</body>
</html>
HTML<script>标签
HTML<script>标记用于包括外部脚本文件或为HTML文档定义内部脚本。
下面的例子: 使用JavaScript定义一个简单JavaScript函数
<!DOCTYPE html>
<html>
<head>
<title>HTML script Tag Example</title>
<base href = "http://www.theitroad.com/" />
<script type = "text/JavaScript">
function Hello() {
alert("Hello, World");
}
</script>
</head>
<body>
<input type = "button" onclick = "Hello();" name = "ok" value = "OK" />
</body>
</html>

