一文读懂HTML的头部内容,希望有所帮助
admin
2024-03-21 11:19:08
0

HTML的头部

  • HTML篇_第五章、HTML的``
    • 一、HTML ``元素
    • 二、``元素</li><li>三、`<base>`元素</li><li>四、`<link>元素`</li><li>五、`<style>`元素</li><li>六、`<meta>`元素</li><li><ul><li>6.1为搜索引擎定义关键词</li><li>6.2为网页定义描述内容</li><li>6.3定义网页作者</li></ul></li><li>七、`<script>`元素</li></ul></li></ul> <p></p> <h1>HTML篇_第五章、HTML的<code><head></code></h1> <h2>一、HTML <code><head></code>元素</h2> <p><code><head></code>元素包是整个文档的头部区域,它定义了文档信息,包含了所有的头部标签元素。在<code><head></code>元素中可以插入脚本(JavaScript)、样式文件(CSS)以及各种meta信息。可以添加在头部区域的元素见下文中的表格。</p> <table><thead><tr><th align="center">标签</th><th align="center">描述</th></tr></thead><tbody><tr><td align="center"><code><head></code></td><td align="center">定义了文档的信息</td></tr><tr><td align="center"><code><title></code></td><td align="center">定义了文档的标题</td></tr><tr><td align="center"><code><base></code></td><td align="center">定义了页面链接标签的默认链接地址</td></tr><tr><td align="center"><code><link></code></td><td align="center">定义了文档和外部资源之间的联系</td></tr><tr><td align="center"><code><meta></code></td><td align="center">定义了HTML文档中的元数据</td></tr><tr><td align="center"><code><script></code></td><td align="center">定义了客户端的脚本文件</td></tr><tr><td align="center"><code><style></code></td><td align="center">定义了HTML文档的样式文件</td></tr></tbody></table> <h2>二、<code><title></code>元素</h2> <p><code><title></code>元素定义了不同文档的标题,它在HTML文档中是必须存在的。在浏览器中,该元素的内容在搜索引擎的结果页面作为标题显示。在网页被收藏添加到收藏夹的时候,在收藏夹内也作为标题来显示。</p> <p><strong>代码演示:</strong></p> <pre><code><!DOCTYPE html> <html><head><meta charset="utf-8"><title>文档标题

      文档内容

      三、元素

      标签描述了基本的链接地址/链接目标,则该标签作为HTML文档中所有的链接标签的默认链接

      代码演示:

      
      
      
       
      文档标题 
      
      
      
      
      

      标签指定了页面上所有链接的默认URL,URL需要在该标签的href属性内填写。上述代码中target属性值设置为“_blank”的意思是:链接会在新窗口打开。

      四、元素

      标签他定义了文档于外部标签之间的联系,通常用于链接到样式表。

      代码演示:

      
      文档标题
      
      

      上述代码中,rel(全称:relationship)的属性值设置为“stylesheet”的意思是描述了当前页面与href所指定文档的关系.即说明的是,href连接的文档是一个新式表;type属性是类型属性,属性值设置为"text/css"意思是告诉浏览器这里的文本内容(text)要层叠样式表(css)来解析;href属性的值设置为“demo.css”的意思是:当前层叠样式表(css)文件的文件路径。

      五、

      《桃花源记》

      晋·陶渊明

      晋太元中,武陵人捕鱼为业。缘溪行,忘路之远近。忽逢桃花林,夹岸数百步,中无杂树,芳草鲜美,落英缤纷,渔人甚异之。复前行,欲穷其林。
      林尽水源,便得一山,山有小口,仿佛若有光。便舍船,从口入。初极狭,才通人。复行数十步,豁然开朗。土地平旷,屋舍俨然,有良田美池桑竹之属。阡陌交通,鸡犬相闻。其中往来种作,男女衣着,悉如外人。黄发垂髫,并怡然自乐。
      见渔人,乃大惊,问所从来。具答之。便要还家,设酒杀鸡作食。村中闻有此人,咸来问讯。自云先世避秦时乱,率妻子邑人来此绝境,不复出焉,遂与外人间隔。问今是何世,乃不知有汉,无论魏晋。此人一一为具言所闻,皆叹惋。余人各复延至其家,皆出酒食。停数日,辞去。此中人语云:“不足为外人道也。”
      既出,得其船,便扶向路,处处志之。及郡下,诣太守,说如此。太守即遣人随其往,寻向所志,遂迷,不复得路。
      南阳刘子骥,高尚士也,闻之,欣然规往。未果,寻病终,后遂无问津者

      上述代码中type属性值设置为"text/css"意思是告诉浏览器这里的文本内容(text)要层叠样式表(css)来解析。标签内容的意思是设置HTML文档的主题北京颜色为红色,段落的文字颜色为黑色。该部分涉及到层叠样式表(css)的相关知识,性情请参见关于层叠样式表(css)的系列文章,在此不做赘述。

      六、元素

      元素提供了元数据,一般放置在区域通常用于指定网页的描述、关键词、文件的最后修改时间、作者和其他元数据。这些元数据会被浏览器解析,可以使用于浏览器(如何显示内容或加载页面)、搜索引擎(关键词)或者其他web服务,但是这些元数据不会显示在页面上。常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie;它可以用于鉴别作者,设定页面格式,标注内容提要和关键字;还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置RASC内容等级,等等。

      接下来举几个标签的实际应用例子。

      6.1为搜索引擎定义关键词

      
      

      上述代码中name属性是用来描述网页的,它的值“keywords”用于指定所提供的信息内容,的意思是为搜索引擎提供关键字列表,对应于content(网页内容)属性使用,便于搜索引擎查找分类。content属性的值为设置的关键字,上述代码中设置了三个关键字,各个关键字之间需要用英文逗号隔开。

      6.2为网页定义描述内容

      
      

      上述代码中name属性的值设置为"description",意思是:告诉搜索引擎当前页面的主要内容。

      6.3定义网页作者

      
      

      上述代码中name属性的值设置为"author",定义网页的作者。

      七、