HTML5知识整理_html5内容整理-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_39530324/article/details/95895280

本文介绍了HTML中一些常用标签的定义、用法等信息。如meta标签提供页面元信息，script标签定义客户端脚本，style标签定义文档样式信息，link标签链接外部样式表，div标签可分割文档。还提及了部分标签的属性含义、浏览器支持度等内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.<meta>标签
a.定义：提供有关页面的元信息。比如针对搜索引擎的关键词。
b.用法：位于文档头部，不包含任何内容。
其属性定义与文档有关的信息名称/信息值对（即键值对）。
c.举例：
//定义针对搜索引擎的关键词，其中keywords表示关键词名称，后者是关键词的值。
<meta name="keywords" content="HTML,CSS,XML,XHTML,JavaScript"/>
//定义对页面的描述，其中description就代表描述名称，后者是描述值

<meta name="description" context="免费的Web技术教程"/>

//定义页面的最新版本
<meta name="revised" content="David, 2008/8/8/"/>
//每5秒刷新一次页面
<meta http-equiv="refresh" content="5"/>
2.<script>标签
a.定义：用来定义客户端脚本。比如JavaScript。
b.用法：既可以包含脚本语句，也可通过src属性指向外部脚本文件。
c.JavaScript应用：
图像操作，表单验证以及动态内容更新。
3.<style>标签
a.定义：用来给文档定义样式信息，理解为在style中可以规定在浏览器如何呈现文档。
b.用法：当前标签的type作为必须属性，它定义style元素的内容，值是“text/css”。
style元素位于文档头部。
c.举例:

  <html
     <head>
            <style type="text/css">
                     h1{color:red}
                     p{color:green}
            </style>
     </head>
     <body>
               <h1>Header 1</h1>
               <p>A paragraph.</p>
     </body>
   </html>

d.浏览器支持度：所有主流浏览器支持
4.<link>标签：
a.定义：用来链接外部样式表
b.用法:
link元素是空元素，仅包含属性；
只存在于文档头部，但可出现任何次数。
c.举例：
<head>
<link rel="styleSheet" type="text/css" href="theme.css"/>
</head>

d.属性含义：
rel----->规定当前文档与被链接文档的关系。比如样式表关系。
type—>规定被链接文档的MIME类型
href---->规定被链接文档的位置
e.MIME类型：
定义：是设定某种扩展名文件用一种应用程序来打开的方式类型。
理解：服务器将其发送的多媒体数据的类型告诉浏览器即给浏览器说明该多媒体数据的 MIME类型，以让浏览器知道接收到的信息哪些是MP3文件，哪些是Shockwave文件等并采用哪种插件来读取。
f.<div>标签
定义：可定义文档中的分区或节。
作用：可把文档分割为独立的不同部分。可用做组织工具并不使用任何格式与其关联。
用法：div是一个块级元素，其内容自动开始下一行；
通过class或id属性应用额外的样式；
不必为每一个div都加class或id;
常见情况是对同一个div只应用class和id中的一种属性；
class用于类似的元素即某一类元素，id用于表示单独的唯一元素。
浏览器支持度：所有主流浏览器支持
举例：

<body>
     <h1>NEWS WEBSITE</h1>
     <p>Some text,Some text,Some text...</p>
     ...
     <div class="news">
          <h2>News headline 1</h2>
          <p>Some text,Some text,Some text...</p>
          ...
     </div>
     <div class="news">
         <h2>News headline 2</h2>
         <p>Some text,Some text,Some text...</p>
         ...
     </div>
     ...
</body>
例子解释：
上述代码已模拟新闻网站结构。
其中每个div把每条新闻的标题和摘要组合在一起即div为文档加了额外结构。同时，这些div属于同一类元素，则使用class="news"对这些div进行标识。