HTML5标签详解-优快云博客

本文链接：https://blog.youkuaiyun.com/moveofgod/article/details/7662185

class 属性和id属性可以使用在所有的元素上, 已保证同其他元素的区别.

1. 注释标签 **

例如

2. HTML5 声明标签

<!DOCTYPE HTML>

3. 超链接 <a>

<a href = "http://blog.youkuaiyun.com" target = "_blank"> china csdn </a>

4. 缩写 <abbr>

<abbr title = "The Republic of China" > PRC < /abbr> --> 将鼠标放到 PRC上会有提示 The Republic of China .

5. 联系作者 <address>

<address> author : kevin </address>

6. 脚本标签 <script>

a. 直接嵌套 <script type = "text/javascript" > alert("hello") </script> , 不能在任何地方出现 "</script>" , 例如 alert("</script>") 否则解析器会将其解析成script结束, 可以使用alert( "/<scr" + "ipt>") 拆开可以

b. 外部文件 <script type = "text/javascript" src = "example.js"/script> , 新的html5支持异步解析, 具体为 async , 其中 src指向相应文件的URL,而这个url即可以是本地文件,也可以是其他区域的文件.

7. <noscript>

主要的作用是,当浏览器不支持JavaScript脚本时或者当脚本被禁用时, 则可以使用其中的内容给出提示

< !-- --> 注意,所有的javascript代码要写在HTML的注释里,因为有很多浏览器不支持javascript,这样就会将内容直接输出

alert("haha");

// -->

</script>

8.<img>

标签定义html中的图象, 此图象只是引用, 而非真正的将图象插入到html中, 两个属性必须 src, alt , src只的是引用的 url , alt指规定图象的替代文本

例如 <img src = "ss.jpg" alt = "asdf" /> 当使用map时要添加 usemap属性

9.<map>

标签定义客户端的映射图象,所谓映射图象是指带有点击区域的图象. name属性是必须属性, 并且其值要与 img标签中 usemap相关联

<img src = "ss.jpg" alt = "asdf" usemap = "#aa" /> -->这个 # 号实验, 如果没有 #号也是OK

</map>

10.<area>

标签定义图象映射的内部区域, area元素始终嵌套在map标签中

<map name = "aa"> --> 相关

</map>

11.<article>

标签定义独立的内容 , 如论坛帖子, 报纸文章 , 博客条目 , 用户评论

<article> this is an article </article>

12.<aside>

标签定义其所处内容之外的内容. 标签应该与附近内容有关系

一般与 article标签合用 , 提示：<aside> 的内容可用作文章的侧栏。

<aside> this is a aside </aside>

13.<audio>

标签定义声音

</audio>

14.<b>

标签定义为粗体, 用于强调某些文本.

<b> 这是一个粗体 </b>

15.<base>

必须放在<head>中, 并且规定所有标签默认的href , 也就是文本链接

16.<bid>

bdi 指的是 bidi 隔离。

<bdi> 标签允许您设置一段文本，使其脱离其父元素的文本方向设置。

在发布用户评论或其他您无法完全控制的内容时，该标签很有用

可以使用标签

注释

<!doctype html> 定义为html5

<a>

<abbr>省略

<address>作者

<article> ?

<aside> ?

<audio>声音

<b>粗体

<body>

<br>换行

<canvas>画图

<table>表格

<caption>表格标题

<col>列属性

<colgroup>列组属性

提示：如果您希望为一组表格列规定相同的属性值，请使用 <colgroup> 元素。

提示：如果您希望为多个表格列规定不同的属性值，请使用 <col> 元素。

<datalist>提示

<dl>

<dt>

<dd>

<del>删除线

<div> 标签常用于组合块级元素，以便通过样式表来对这些元素进行格式化

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

序号	标签	重要程度	属性情况	全局属性是否支持	备注
1	<!-- -->	***	无	否
2	<!doctype html>	***	无	否
3	<a>	***	href,target	是
4	<abbr>	*	title	是
5	<address>	**	是
6	<area>	**	alt,coords,href,shape,target	是	永远嵌套在map标签中
7	<article>	**	是
8	<aside>	*	是	可做文章的侧栏
9	<audio>	**	autoplay,controls,loop,preload,src	是
10	<b>	**
11	<base>	*	href,target	否	为所有的链接规定默认地址
12	<bdi>	**	dir	是	在发布拥护平炉或其他您无法完全控制的内容时，有用
13	<bdo>	*	dir	是
14	<blockquote>	*	cite	是	引用
15	<body>	**	是
16	<br />	***	是
17	<button>	***	disabled,form,name,type,value	是
18	<canvas>	***	width, height	是
19	<caption>	**	是	放在table中
20	<col>	**	span	是	只能在table和colgroup中,只能规定一种式样,比如第一列式样是什么,也可以把第二列和第一列设置到一起
21	<colgroup>	**	span	是	只能在table中
22	<dd>	*	是	dl,dd,dt一起使用
23	<del>	*	是
24	<div>	**	是	组合块级元素,统一式样表使用
25	<dl>	**	是
26	<dt>	**	是
27	<fieldset>	**	disabled,form,name	是	也是逻辑组合在一起,并且周围有边框
28	<figcaption>	*	是	figure标题
29	<figure>	**	是	独立的流内容
30	<footer>	*	是
31	<form>	***	action,autocomlete,method,name,target	是
32	<h1>-<h6>	*	是
33	<head>	*	是	<base><link><meta><script><style><title>可以用在head中
34	<header>	*	是	文档的页眉
35	<hgroup>	*	是	将h1,h2等组合在一起
36	<hr>	*	是
37	<html>	*	manifest,xmlns	是
38	<i>	*	是	斜体
39	<iframe>	**	src	是	网页中的网页
40	<img>	***	alt,src,height,width,ismap,usemap	是
41	<input>	***	很多	是
42	<ins>	*	cite,datetime	是	请也<del>标签一起使用
43	<label>	**	for,form	是
44	<lgend>	**	是	是fieldset,figure的标题
45	<li>	**	是	列表使用
46	<link>	***	rel,href,type	是	基本上是用来连接式样表CSS
47	<map>	**	name,id	是	只能是与img一起使用,注意,name和id的值必须一样,所以只要指定一个就可以了
48	<mark>	*	是	带有记号的文本,背景变黄色
49	<menu>	**	label,type,autosubmit	是	定义菜单列表,<li>可以被使用用来显示列表
50	<meta>	*	是	<meta charset="ISO-8859-1">
51	<meter>	*	是	定义一个度,给出图形显示,与progress差不多
52	<nav>	***	是	导航
53	<noscript>	*	否
54	<object>	*	data,form,height,name,type,usemap,width	是	嵌入文件
55	<ol>	**	start	是
56	<optgroup>	*	laebl,disabled	是	定义选项组,只能与select合用
57	<option>	**	disabled,label,selected,value	是	只能与select合用
58	<output>	*	for,form,name	是
59	<p>	**	是
60	<param>	*	name,value	是	可为<object>标签提供参数
61	<pre>	*	是	预格式化
62	<progress>	**	max,value	是
63	<q>	*	cite	是	定义引用
64	<rp><ruby><rt>	*	是	汉字注音相关
65	<script>	**	type,src	是
66	<section>	**	是	文档中的节
67	<select>	***	是	下拉列表
68	<source>	**	media,src,type	是	定义音频,视频
69	<span>	*	是	行内元素进行分组
70	<style>	*	是	式样表CSS,一般都使用外部文件
71	<sub><sup>	*	是	下标,上标
72	<table>	***	border	是
73	<td><tr><th>	**	是
74	<textarea>	*	cols,disabled,form,inputmode,name,readonly,required,rows	是	文本区域
75	<title>	*	是
76	<ul>	**	是
77	<video>	**	autoplay,controls,height,loop,src,width	是	视频
78	<wbr>	*	当宽度够时,不换行,宽度不够时,主动在该地方换行,而不是在本行末位置换行

CSS

序号	类别	例子	记忆情况	其他
1	元素	body,h1等等	可以将多个元素写在一起,共用一个式样表
2	id	#myid	可以和元素一起使用	特殊属性
3	class	.center	也可以和元素等一起使用,也是一个属性,只不过被单独提出来了,像 id 一样	特殊属性
4	属性	[dir]

HTML5标签

class 属性和id属性可以使用在所有的元素上, 已保证同其他元素的区别.

1. 注释标签

2. HTML5 声明标签

3. 超链接 <a>

4. 缩写 <abbr>

5. 联系作者 <address>

6. 脚本标签 <script>

7. <noscript>

8.<img>

9.<map>

10.<area>

11.<article>

12.<aside>

13.<audio>

14.<b>

15.<base>

16.<bid>

1. 注释标签 **