HTML <head>
admin2024-08-15 14:25:50HTML教程
HTML
查看在线实例
- 定义了HTML文档的标题<br>
使用 <title> 标签定义HTML文档的标题</p>
<p><base> - 定义了所有链接的URL<br>
使用 <base> 定义页面中所有链接默认的链接目标地址。</p>
<p><meta> -
提供了HTML文档的meta标记<br>
使用 <meta> 元素来描述HTML文档的描述，关键词，作者，字符集等。</p>
<hr><h2>HTML <head> 元素</h2>
<p><head> 元素包含了所有的头部标签元素。在
<head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。</p>
<p>可以添加在头部区域的元素标签为: <title>, <style>,
<meta>, <link>,
<script>, <noscript> 和 <base>。</p>
<hr><h2> HTML <title> 元素</h2>
<p> <title> 标签定义了不同文档的标题。</p>
<p> <title> 在 HTML/XHTML 文档中是必需的。</p>
<p> <title> 元素:</p>
定义了浏览器工具栏的标题
当网页添加到收藏夹时，显示在收藏夹中的标题
显示在搜索引擎结果页面的标题
<p>一个简单的 HTML 文档:</p>
<h2 class="example">实例</h2>
<span class="hl-brackets"><</span><span class="hl-code">!</span><span class="hl-var">DOCTYPE</span><span class="hl-code"> </span><span class="hl-var">html</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">html</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">meta</span><span class="hl-code"> </span><span class="hl-var">charset</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">utf-8</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">title</span><span class="hl-brackets">></span><span class="hl-code">文档标题</span><span class="hl-brackets"></</span><span class="hl-reserved">title</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">body</span><span class="hl-brackets">></span><span class="hl-code">
文档内容......
</span><span class="hl-brackets"></</span><span class="hl-reserved">body</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">html</span><span class="hl-brackets">></span>
<br>
<hr><h2>HTML <base> 元素</h2>
<p><base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:</p>
<h2 class="example">实例</h2> <span class="hl-brackets"><</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">base</span><span class="hl-code"> </span><span class="hl-var">href</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">http://www.runoob.com/images/</span><span class="hl-quotes">"</span><span class="hl-code"> </span><span class="hl-var">target</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">_blank</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">head</span><span class="hl-brackets">></span>
<hr><h2> HTML <link> 元素</h2>
<p> <link> 标签定义了文档与外部资源之间的关系。</p>
<p> <link> 标签通常用于链接到样式表:</p>
<h2 class="example">实例</h2> <span class="hl-brackets"><</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">link</span><span class="hl-code"> </span><span class="hl-var">rel</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">stylesheet</span><span class="hl-quotes">"</span><span class="hl-code"> </span><span class="hl-var">type</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">text/css</span><span class="hl-quotes">"</span><span class="hl-code"> </span><span class="hl-var">href</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">mystyle.css</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">head</span><span class="hl-brackets">></span>
<br>
<hr><h2>HTML <style> 元素</h2>
<p><style> 标签定义了HTML文档的样式文件引用地址.</p>
<p>在<style> 元素中你也可以直接添加样式来渲染 HTML 文档:</p>
<h2 class="example">实例</h2> <span class="hl-brackets"><</span><span class="hl-reserved">head</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"><</span><span class="hl-reserved">style</span><span class="hl-code"> </span><span class="hl-var">type</span><span class="hl-code">=</span><span class="hl-quotes">"</span><span class="hl-string">text/css</span><span class="hl-quotes">"</span><span class="hl-brackets">></span><span class="hl-code">
body {
background-color:yellow;
}
p {
color:blue
}
</span><span class="hl-brackets"></</span><span class="hl-reserved">style</span><span class="hl-brackets">></span><span class="hl-code">
</span><span class="hl-brackets"></</span><span class="hl-reserved">head</span><span class="hl-brackets">></span>
<br>
<hr><h2>HTML <meta> 元素</h2>
<p>meta标签描述了一些基本的元数据。</p>
<p><meta> 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。</p>
<p>META 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。</p>
<p>元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。</p>
<p><meta> 一般放置于 <head> 区域</p>
<h2><meta> 标签- 使用实例</h2>
<p>为搜索引擎定义关键词:</p>
<pre>
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
</pre>
<p>为网页定义描述内容:</p>
<pre>
<meta name="description" content="免费 Web & 编程 教程">
</pre>
<p>定义网页作者:</p>
<pre>
<meta name="author" content="Runoob">
</pre>
<p>每30秒钟刷新当前页面:</p>
<pre><meta http-equiv="refresh" content="30">
</pre>
<br>
<hr><h2>HTML <script> 元素</h2>
<p><script>标签用于加载脚本文件，如： JavaScript。</p>
<p><script> 元素在以后的章节中会详细描述。</p>
<hr><h2>HTML head 元素</h2>
<table class="reference">
<tbody><tr>
<th width="20%" align="left">标签</th>
<th width="80%" align="left">描述</th>
</tr>
<tr>
<td><head></td>
<td>定义了文档的信息</td>
</tr>
<tr>
<td><title></td>
<td>定义了文档的标题</td>
</tr>
<tr>
<td><base></td>
<td>定义了页面链接标签的默认链接地址</td>
</tr>
<tr>
<td><link></td>
<td>定义了一个文档和外部资源之间的关系</td>
</tr>
<tr>
<td><meta></td>
<td>定义了HTML文档中的元数据</td>
</tr>
<tr>
<td><script></td>
<td>定义了客户端的脚本文件</td>
</tr>
<tr>
<td><style></td>
<td>定义了HTML文档的样式文件</td>
</tr>
</tbody></table> <!-- 其他扩展 -->
</div>
<footer class="entry-meta">
<p id="tag-wrap" class="tag-wrap">
<i class="fa fa-tags"></i> 标签： </p>
<div class="clear"></div>
</footer>
<div class="authorbio">
<ul class="spostinfo">
<li><strong>声明：</strong>本站内容均来自互联网，如果侵犯了您的权益请与我们联系，我们将在24小时内删除。</li>
<li><strong>本文地址：</strong><a href="http://www.humeup.cn/HTML/1887.html" title="">http://www.humeup.cn/HTML/1887.html</a></li>
</ul>
</div>
</div>
</div>
<div class="article">
<div class="article-container">
<div class="post-navigation">
<div class="post-previous"><span class="prev">上一篇</span><a href="/HTML/1886.html">HTML 样式- CSS</a></div>
<div class="post-next"><span class="next">下一篇</span><a href="/HTML/1888.html">HTML 链接</a></div>
</div>
</div>
</div>
<div class="article">
<div class="article-container">
<div class="relates">
<div class="title">
<h3>相关文章</h3>
</div>
<div id="related-img">
<ul id="related">
</ul>
<div class="clear"> </div>
</div>
</div>
</div>
</div>
</div>
<aside class="sidebar" id="sidebar">
<dl class="function" id="side-adimg">
<dt class="function_t">广告</dt>
<dd class="function_c">
<a href="https://t.aliyun.com/U/oTpGxp" target="_blank"><img src="/static/v1/pc/images/aliyun.jpg" alt="【阿里云】云服务器u1-实例2核4G 80G，新人专享渠道特惠价只要199元！特惠热卖中。 点击【 https://t.aliyun.com/U/oTpGxp 】立即购买"></a>
</dd>
</dl>
<dl class="function" id="side-tui-article-item">
<dt class="function_t">热门阅读</dt>
<dd class="function_c">
<div>
<article><a href="/douyin/2470.html" class="image"><img src="https://www.runoob.com/images/tryitimg.gif" alt="瞄准小学生，品牌靠几十元单品月入5千万！"></a>
<h3><a href="/douyin/2470.html">瞄准小学生，品牌靠几十元单品月入5千万！</a></h3>
</article>
<article><a href="/douyin/2450.html" class="image"><img src="https://www.runoob.com/images/tryitimg.gif" alt="抖音爆款脚本拆解.pdf(抖音脚本模板)"></a>
<h3><a href="/douyin/2450.html">抖音爆款脚本拆解.pdf(抖音脚本模板)</a></h3>
</article>
<article><a href="/douyin/2449.html" class="image"><img src="https://www.runoob.com/images/tryitimg.gif" alt="抖音完整运营玩法.ppt！(抖音企业运营方案ppt)"></a>
<h3><a href="/douyin/2449.html">抖音完整运营玩法.ppt！(抖音企业运营方案ppt)</a></h3>
</article>
<article><a href="/douyin/2448.html" class="image"><img src="https://www.runoob.com/images/tryitimg.gif" alt="抖音起号指南.pdf"></a>
<h3><a href="/douyin/2448.html">抖音起号指南.pdf</a></h3>
</article>
</div>
</dd>
</dl>
<dl class="function" id="side-adimg">
<dt class="function_t">广告</dt>
<dd class="function_c">
<a href="https://www.aliyun.com/daily-act/ecs/activity_selection?userCode=vgt859tn" target="_blank"><img src="/static/v1/pc/images/aliyun2.jpg" alt="【阿里云】云服务器u1-实例2核4G 80G，新人专享渠道特惠价只要199元！特惠热卖中。 点击【 https://t.aliyun.com/U/oTpGxp 】立即购买"></a>
</dd>
</dl>
<dl class="function" id="divTags">
<dt class="function_t">标签列表</dt>
<dd class="function_c">
<ul>
<li><a href="/tag/steam.html">Steam</a></li>
<li><a href="/tag/fuzhoushishangwuju.html">福州市商务局</a></li>
<li><a href="/index.php?s=tag&name=win12">WIN12</a></li>
<li><a href="/index.php?s=tag&name=mysql">mysql</a></li>
<li><a href="/index.php?s=tag&name=shujuku">数据库</a></li>
<li><a href="/tag/heishenhuawukongguanwang.html">黑神话悟空官网</a></li>
<li><a href="/tag/xiaohongshu.html">小红书</a></li>
<li><a href="/index.php?s=tag&name=win10">WIN10</a></li>
<li><a href="/tag/2024nianjuminyibaojiaofeibiaozhunshiduoshao.html">2024年居民医保缴费标准是多少</a></li>
<li><a href="/tag/heishenhua:wukong.html">黑神话:悟空</a></li>
<li><a href="/tag/fuzhoushidianzishangwu.html">福州市电子商务</a></li>
<li><a href="/index.php?s=tag&name=win8">WIN8</a></li>
<li><a href="/tag/2024nianjuminyibaojiaofeibiaozhun.html">2024年居民医保缴费标准</a></li>
<li><a href="/tag/xiaohongshuyinliu.html">小红书引流</a></li>
<li><a href="/index.php?s=tag&name=win7">WIN7</a></li>
</ul>
</dd>
</dl>
<dl class="function" id="divLinkage">
<dt class="function_t">友情链接</dt>
<dd class="function_c">
<ul>
<li><a href="http://gas.humeup.cn?ref=www.humeup.cn" target="_blank">今日油价</a></li><li><a href="http://www.zmbug.com?ref=www.humeup.cn" target="_blank">黄金在线</a></li> </ul>
</dd>
</dl>
</aside></main>
<footer class="footer-box">
<div class="footer-bottom">
<div class="container">
<div class="row">
<div class="col-md-12 align-center">
<p> <span><a href="/jsjc/" title="技术教程">技术教程</a></span><span><a href="/baike/" title="知识百科">知识百科</a></span><span><a href="/gonglue/" title="游戏攻略">游戏攻略</a></span><span><a href="/yuanma/" title="源码模版">源码模版</a></span><span><a href="/news/" title="今日资讯">今日资讯</a></span><span><a href="/jianzhan/" title="建站教程">建站教程</a></span><span><a href="/wlyy/" title="网络运营">网络运营</a></span> <p>Copyright © <span>2024 © 汇美优普</span><span><a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">闽ICP备09041570号 </a></span> <span><a href="/sitemap.xml" target="_blank">XML地图</a></span> </p>
</div>
</div>
</div>
</div>
</footer>
<div id="topcontrol" title="返回顶部"><i class="fa fa-angle-up"></i></div>
<div id="mask" style="display: none;"></div>
<script src="/static/v1/pc/js/main.js"></script>
<script src="/static/v1/pc/js/navigation.js"></script>
<script src="/static/v1/pc/js/side.js"></script>
<script src="/static/v1/pc/js/qrcode.min.js"></script>
<div style='display:none'>
</div>
</body>
</html>
