根元素
元素 |
描述 |
<htm> |
<html> 元素 表示一个HTML文档的根(顶级元素),所以它也被称为根元素。所有其他元素必须是此元素的后代 |
文档元数据
元素 |
描述 |
<link> |
<link> 元素规定了外部资源与当前文档的关系。 这个元素可用来为导航定义一个关系框架。这个元素最常于链接样式表 |
<meta> |
<meta> 元素**表示那些不能由其它HTML元相关元素base, link, script, style之一表示的任何元数据信息 |
<style> |
<style>元素包含文档的样式信息或者文档的部分内容。默认情况下,该标签的样式信息通常是[CSS](https://developer.mozilla.org/en-US/docs/Web/CSS)的格式 |
<title > |
<title> 元素 定义文档的标题,显示在浏览器的标题栏或标签页上。它只可以包含文本,若是包含有标签,则包含的任何标签都不会被解释 |
内容分区
内容分区元素允许你将文档内容从逻辑上进行组织划分。使用包括页眉(header)、页脚(footer)、导航(nav)和标题(h1~h6)等分区元素,来为页面内容创建明确的大纲,以便区分各个章节的内容。
元素 |
描述 |
<address> |
HTML 的<address>元素可以让作者为它最近的article或者body祖先元素提供联系信息。在后一种情况下,它应用于整个文档。 |
<artitle> |
<article>元素表示文档、页面、应用或网站中的独立结构,其意在成为可独立分配的或可复用的结构,如在发布中,它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件,或者其他独立的内容项目。 |
<aside> |
<aside> 元素表示一个和其余页面内容几乎无关的部分,被认为是独立于该内容的一部分并且可以被单独的拆分出来而不会使整体受影响。其通常表现为侧边栏或者嵌入内容。他们通常包含在工具条,例如来自词汇表的定义。也可能有其他类型的信息,例如相关的广告、笔者的传记、web 应用程序、个人资料信息,或在博客上的相关链接。 |
<footer> |
HTML <footer> 元素表示最近一个章节内容元素的页脚。一个页脚通常包含该章节作者、版权数据或者与文档相关的链接等信息。 |
<header > |
<header>元素表示一组引导性的帮助,可能包含标题元素,也可以包含其他元素,像logo、分节头部、搜索表单等。 |
<main> |
HTML <main>元素呈现了文档<body>或应用的主体部分。主体部分由与文档直接相关,或者扩展于文档的中心主题、应用的主要功能部分的内容组成。这部分内容在文档中应当是独一无二的,不包含任何在一系列文档中重复的内容,比如侧边栏,导航栏链接,版权信息,网站logo,搜索框(除非搜索框作为文档的主要功能)。 |
nav |
HTML导航栏 (<nav>) 描绘一个含有多个超链接的区域,这个区域包含转到其他页面,或者页面内部其他部分的链接列表. |
<section> |
HTML Section 元素表示文档中的一个区域(或节),比如,内容中的一个专题组,一般来说会有包含一个标题(heading)。一般通过是否包含一个标题 <h1> 作为子节点 来 辨识每一个<section>。 |
<a>标签及其常用属性
<a> 元素 (或锚元素) 可以创建一个到其他网页、文件、同一页面内的位置、电子邮件地址或任何其他URL的超链接。
- href属性
链接到外部地址:
<a href="http://www.mozilla.com/"> External Link </a>
链接到本页的某个部分
<a href="#属性"> Description of Same-Page Links </a>
创建一个可点击的图片
<a href="https://developer.mozilla.org/en-US/"> <img src="https://mdn.mozillademos.org/files/6851/mdn_logo.png" alt="MDN logo" /> </a>
创建一个email链接
<a href="mailto:nowhere@mozilla.org">Send email to nowhere</a>
- target属性
<a href="http://qq.com" target="_blank">QQ</a> //在空白页面打开新窗口
<a href="http://qq.com" target="_self">QQ</a> //在当前页面打开新窗口
<a href="http://qq.com" target="_parent">QQ</a> //加载响应到当前框架的HTML5浏览上下文的父浏览上下文。如果没有parent框架或者浏览上下文,此选项的行为方式相同_self
<a href="http://qq.com" target="_top">QQ</a> //加载响应进入顶层浏览上下文(即,浏览上下文,它是当前的一个的祖先,并且没有parent)。如果没有parent框架或者浏览上下文,此选项的行为方式相同_self
form标签
<!-- 一个简单的表单,这个表单会发送一个 GET 请求 -->
<form action="">
<label for="GET-name">Name:</label>
<input id="GET-name" type="text" name="name">
<input type="submit" value="Save">
</form>
<!-- 一个简单的表单,发送 POST 请求 -->
<form action="" method="post">
<label for="POST-name">Name:</label>
<input id="POST-name" type="text" name="name">
<input type="submit" value="Save">
</form>
<!-- 使用 fieldset, legend, and label 的表单 -->
<form action="" method="post">
<fieldset>
<legend>Title</legend>
<input type="radio" name="radio" id="radio"> <label for="radio">Click me</label>
</fieldset>
</form>
table标签