第一部分: 全局属性
1.1 html全局属性
1. class: 类
2. style: 行内样式
3. title: 标题
原生title属性会有一定时间的延时作用, 不常用
4. id: 唯一ID
命名规则:
- 必须以字母A-Z 或 a-z开头
- 其后的字符: 字母(A-Za-z)、数字(0-9)、连字符("-")、下划线("_")、冒号(":") 以及点号(".")
- 值对大小写敏感
5. tabindex: 设置元素的 Tab 键控制次序。
属性值: number => 规定元素的tab键控制顺序(1是第一).
6. dir: 文字方向
属性值: ltr(默认, 从左到右) | rtl(从右到左) | auto( 让浏览器根据内容来判断文本方向。仅在文本方向未知时推荐使用)
通过css一样可以控制文本方向.
7. lang: 元素内容的语言
8. accesskey: 访问元素的键盘快捷键。
规定激活(使元素获得焦点)元素的快捷键。
注意: 在不同操作系统中不同的浏览器中访问快捷键的方式不同的
1.2 html5全局属性
1. data-*: 自定义属性
只是一个规范, 在js中就可以通过 dataset 对象进行操作
2. draggable: 是否可以拖动
配合HTML5 的 拖放来实现元素的拖放
属性值: true(可拖动) | false(不可拖动) | auto (根据浏览器的默认特性, 有些元素默认是可以拖动的)
3. contenteditable: 是否可编辑
常用来处理富文本
属性值: true(可编辑) | false(不可编辑)
4. hidden: 是否隐藏
使用该属性, 则会隐藏元素, 行为类似于display: none;
5. 无用属性 或 兼容性较差属性
MDN还有一些实验性全局属性, HTML也开始倾向于原生组件方式.
- contextmenuNew 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单
- dropzoneNew 指定是否将数据复制,移动,或链接,或删除
- spellcheckNew 检测元素是否拼写错误
- translateNew 指定是否一个元素的值在页面载入时是否需要翻译
第二部分: html标签
2.1 基础标签
1. 定义文档类型。
2. 定义一个 HTML 文档
3. 为文档定义一个标题
4. 定义文档的主体
5. to 定义 HTML 标题
定义 HTML 标题
6.
定义一个段落
7.
定义简单的折行。
在 HTML 中,
标签没有结束标签。
8.
定义水平线。
在 HTML 中,
标签没有结束标签。
9. 定义一个注释
2.2 格式标签
1. 定义粗体文本。
2. 定义文档作者或拥有者的联系信息。
语义化标签, 效果可以使用css实现
3. 定义强调文本。
4. 定义斜体文本。
5. 定义预格式文本
6. 定义加删除线的文本。
7. 定义下划线文本。
8. 定义被删除文本。
9. 不常用标签
- 定义一个缩写。
- 定义文本的方向。
定义块引用。
- 定义引用(citation)。
定义计算机代码文本。
- 定义定义项目。
- 定义被插入文本。
- 定义键盘文本。
定义短的引用。
- 定义计算机代码样本。
- 定义小号文本。
- 定义语气更为强烈的强调文本。
- 定义下标文本。
- 定义上标文本。
- 定义文本的变量部分。
10. H5不支持属性
- HTML5不再支持。 定义只取首字母的缩写。
- HTML5不再支持。 定义大号文本。
HTML5不再支持。 HTML 4.01 已废弃。定义居中文本。 - HTML5不再支持。 HTML 4.01 已废弃。 定义文本的字体、尺寸和颜色
HTML5不再支持。 HTML 4.01 已废弃。 定义加删除线的文本。- HTML5不再支持。 定义打字机文本。
2.3 框架标签
1.
提示:您可以把需要的文本放置在 之间,这样就可以应对不支持
属性值:
width: 定义宽度
height: 定义高度
src: 显示文档的URL
name: 规定框架的名称
...
2. H5不支持属性
HTML5不再支持。 定义框架集的窗口或框架。
HTML5不再支持。 定义针对不支持框架的用户的替代内容。
2.4 图像标签
1.
定义图像
属性值:
- alt: 规定图像的替代文本。
- width: 图像宽度
- height: 图像高度
- src: 图像链接
- ismap: 将图像规定为服务器端图像映射。
- usemap: 将图像定义为客户器端图像映射。
- crossorigin(H5属性): 设置图像的跨域属性
2.
用于客户端图像映射。图像映射指带有可点击区域的一幅图像。
3. 图像地图内部的区域。
标签定义图像映射内部的区域(图像映射指的是带有可点击区域的图像)。
元素始终嵌套在
2.5 链接标签
1. 链接
提示:如果没有使用 href 属性,则不能使用 hreflang、media、rel、target 以及 type 属性。
属性值:
- href: 规定链接的目标 URL。
- target: _blank | _parent | _self | _top | framename 规定在何处打开目标 URL。仅在 href 属性存在时使用。
- rel: 规定当前文档与目标URL之间的关系.
- hreflang: 规定目标 URL 的基准语言。仅在 href 属性存在时使用。其仅提供建议,并没有内置的功能
- type(New): 规定目标 URL 的 MIME 类型 其仅提供建议,并没有内置的功能。
- media(New): 规定目标 URL 的媒介类型。默认值:all。仅在 href 属性存在时使用。
- download(New): 此属性指示浏览器下载 URL 而不是导航到它,因此将提示用户将其保存为本地文件。如果属性有一个值,那么此值将在下载保存过程中作为预填充的文件名(如果用户需要,仍然可以更改文件名)。此属性对允许的值没有限制,但是
/
和\
会被转换为下划线。大多数文件系统限制了文件名中的标点符号,故此,浏览器将相应地调整建议的文件名。
- 此属性仅适用于同源 URL
- 尽管 HTTP URL 需要位于同一源中,但是可以使用 blob: URL 和 data: URL ,以方便用户下载使用 JavaScript 生成的内容(例如使用在线绘图 Web 应用程序创建的照片)
- 如果 HTTP 头中的 Content-Disposition 属性赋予了一个不同于此属性的文件名,HTTP 头属性优先于此属性
- 如果 HTTP 头属性 Content-Disposition 被设置为inline(即 Content-Disposition='inline'),那么 Firefox 优先考虑 HTTP 头 Content-Dispositiondownload 属性
2. 定义文档与外部资源的关系。
标签最常见的用途是链接样式表, 但不仅限于这个作用. 此外也可以被用来创建站点图标(比如PC端的“favicon”图标和移动设备上用以显示在主屏幕的图标) 。
注意: 此元素只能存在于 head 部分,不过它可出现任何次数。
属性值:
- href 定义被链接文档的位置。
- hreflang 定义被链接文档中文本的语言。
- media 规定被链接文档将显示在什么设备上。
- rel 必需。定义当前文档与被链接文档之间的关系。
- type 规定被链接文档的 MIME 类型。'
- sizes(New) 定义了链接属性大小,只对属性 rel="icon" 起作用。
2.6 列表标签
1. 无序列表
2. 有序列表
3.
4. 定义列表
5. 定义列表中的项目。
6. 定义列表中项目的描述。
7.
浏览器支持度很差
2.7 表格
1.
表头单元格。
4. 5.
6. 表头内容。
8. 表格中的表注内容(脚注)。
|
---|
定义表格中一个或多个列的属性值。 定义表格中供格式化的列组。