元信息
<head>
<head> 标签用于定义 HTML 文档的头部信息，主要存放页面的元数据（不会直接显示在网页内容中），包括标题、编码、样式、脚本、描述等。它通常位于 <html> 标签内，紧跟在 <body> 标签之前。
作用：
-
设置网页标题
通过<title>标签，决定浏览器标签栏显示的内容。 -
指定字符编码
使用<meta charset="UTF-8">，确保中文等字符正常显示。 -
页面描述与关键词
用<meta>标签提升 SEO 搜索优化。 -
引入样式与脚本
通过<link>和<script>标签加载 CSS 和 JS 文件。 -
设置视口，适配移动端
<meta name="viewport" content="width=device-width, initial-scale=1.0">实现响应式布局。 -
添加网站图标
<link rel="icon" href="favicon.ico">设置浏览器标签图标。
示例：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>我的网页</title>
<meta name="description" content="这是一个网页示例">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.ico">
</head>
<body>
<!-- 网页内容 -->
</body>
</html>
总结：
-
<head>主要用于存放网页的各种配置和元数据，不直接显示在页面上。 -
合理设置
<head>内容，有助于网页兼容性、SEO优化和用户体验。 -
建议在每个 HTML 页面都规范书写
<head>标签，保证网页信息完整。
<meta>
<meta> 标签用于设置网页的元数据，提供关于页面的信息。它位于 <head> 标签内，不直接显示在页面内容中，但对搜索引擎、浏览器解析、页面适配等非常重要。
作用：
-
字符编码声明
指定页面的编码方式，常用 UTF-8，确保中文等字符正常显示。<meta charset="UTF-8"> -
SEO 优化
提供页面描述和关键词，帮助搜索引擎收录和排名。<meta name="description" content="这是一个HTML示例页面"> <meta name="keywords" content="HTML, meta, 标签, 教程"> -
视口设置（移动端适配）
实现响应式布局，使页面在手机等设备上显示更友好。<meta name="viewport" content="width=device-width, initial-scale=1.0"> -
作者和版权信息
可用于标注页面作者等信息。<meta name="author" content="coder-random"> -
刷新或重定向页面
可设置页面自动刷新或跳转。<meta http-equiv="refresh" content="5;url=https://example.com">
示例：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="description" content="这是一个HTML meta标签示例">
<meta name="keywords" content="HTML,meta,网页,标签">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="coder-random">
<title>meta标签示例页面</title>
</head>
<body>
<!-- 网页内容 -->
</body>
</html>
总结：
-
<meta>标签用于定义页面的元信息，不直接展示在网页上。 -
规范使用
<meta>标签，有助于页面的兼容性、SEO优化和移动端适配。 -
建议在每个 HTML 页面
<head>内根据实际需求合理设置<meta>标签。
<base>
<base> 标签用于设置页面中所有相对链接的基础路径或默认打开方式，它只能放在 <head> 标签内，并且每个文档只能有一个 <base> 标签。主要用于指定网页中的链接、图片、脚本等相对路径的基准地址，或者指定打开链接时的默认目标窗口。
作用：
-
指定基础 URL
当页面中的链接或资源使用相对路径时，浏览器会以<base>标签设定的href为基准地址进行解析。<base href="https://www.example.com/subdir/">如果页面有图片
<img src="pic.jpg">，实际请求会是https://www.example.com/subdir/pic.jpg。 -
指定默认目标窗口
可以用target属性设定页面内所有链接或表单的默认打开方式（如新窗口、当前窗口等）。<base target="_blank">页面内所有
<a>标签没有指定target时，都会在新窗口打开。
示例：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>base标签示例页面</title>
<base href="https://www.example.com/" target="_blank">
</head>
<body>
<a href="docs/index.html">点击访问文档</a>
<img src="images/logo.png" alt="Logo">
</body>
</html>
在此示例中，所有相对链接和图片地址会以 https://www.example.com/ 为基准，并且链接会在新窗口打开。
总结：
<base>标签用于统一设定相对路径的基准地址和链接默认打开方式，简化资源管理。- 只能在
<head>中出现一次，否则浏览器只识别第一个。 - 在多页面项目或有统一资源入口需求时非常实用，但需谨慎使用，避免链接解析混淆。
<basefont>
HTML5 已经废弃此标签，了解 <basefont> 有助于阅读和维护老旧网页代码，但新项目不建议使用。
<basefont> 标签用于设置网页默认字体的样式，可以指定字体的大小、颜色和类型。它属于 HTML 的早期标签，目前已经被废弃，不推荐在现代网页中使用。
主要属性：
-
size：设置字体默认大小<basefont size="4"> -
color：设置字体默认颜色<basefont color="red"> -
face：设置字体类型（如宋体、Arial 等）<basefont face="Arial">
用法示例：
<!DOCTYPE html>
<html>
<head>
<title>basefont 标签示例</title>
<basefont size="5" color="blue" face="Arial">
</head>
<body>
<p>这段文字会应用 basefont 的样式。</p>
<p>所有没有单独设置字体的内容都会继承 basefont 的样式。</p>
</body>
</html>
注意事项：
-
<basefont>是 HTML 4 及更早版本中的标签，HTML5 已经废弃此标签，主流浏览器可能已不支持或表现不一致。 -
推荐使用 CSS 设置网页字体样式，例如：
<style> body { font-size: 18px; color: blue; font-family: Arial, "宋体", sans-serif; } </style>
总结：
<basefont>用于设置网页默认字体样式，已经被淘汰。- 实际开发请使用 CSS 控制字体和样式，保证网页的兼容性和可维护性。
- 了解
<basefont>有助于阅读和维护老旧网页代码，但新项目不建议使用。
扫一扫
1343
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
