最近公司的APP需要更换,领导要求APP里的页面全用web view显示,因为需要显示的内容是关于大赛的内容,需要经常更换页面,相对于传统的原生APP,使用web view就方便很多。通过比较,还是使用Ionic来开发新的APP(iOS+Android),省时省力。本来以为挺简单的东西,结果到它的官网一看http://www.ionic.io,不会用,那只能先学习一下,到中文网址看教程学习http://www.ionic.wang。但是我只会OC和一点C语言,只能从最基础学习,HTML CSS JavaScript angularjs都是需要懂的。下面就开始学习HTML学习之旅。
对于没接触过HTML的我来说,HTML需要记的东西太多了,我是通过菜鸟教程来学习HTML的基础的http://www.runoob.com。
HTML的参考手册(HTML5标准)如下:(来源菜鸟教程)
按字母顺序排列
New : HTML5新标签
标签 | 描述 |
---|---|
<!--...--> | 定义注释 |
<!DOCTYPE> | 定义文档类型 |
<a> | 定义超文本链接 |
<abbr> | 定义缩写 |
<acronym> | 定义只取首字母的缩写,不支持HTML5 |
<address> | 定义文档作者或拥有者的联系信息 |
<applet> | HTML5中不赞成使用。定义嵌入的 applet。 |
<area> | 定义图像映射内部的区域 |
<article>New | 定义一个文章区域 |
<aside>New | 定义页面的侧边栏内容 |
<audio>New | 定义音频内容 |
<b> | 定义文本粗体 |
<base> | 义页面中所有链接的默认地址或默认目标。 |
<basefont> | HTML5不支持,不赞成使用。定义页面中文本的默认字体、颜色或尺寸。 |
<bdi>New | 允许您设置一段文本,使其脱离其父元素的文本方向设置。 |
<bdo> | 定义文字方向 |
<big> | 定义大号文本,HTML5不支持 |
<blockquote> | 定义长的引用 |
<body> | 定义文档的主体 |
<br> | 定义换行 |
<button> | 定义一个点击按钮 |
<canvas>New | 定义图形,比如图表和其他图像,标签只是图形容器,您必须使用脚本来绘制图形 |
<caption> | 定义表格标题 |
<center> | HTML5不支持,不赞成使用。定义居中文本。 |
<cite> | 定义引用(citation) |
<code> | 定义计算机代码文本 |
<col> | 定义表格中一个或多个列的属性值 |
<colgroup> | 定义表格中供格式化的列组 |
<command>New | 定义命令按钮,比如单选按钮、复选框或按钮 |
<datalist>New | 定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。 |
<dd> | 定义定义列表中项目的描述 |
<del> | 定义被删除文本 |
<details>New | 用于描述文档或文档某个部分的细节 |
<dfn> | 定义定义项目 |
<dialog>New | 定义对话框,比如提示框 |
<dir> | HTML5不支持,不赞成使用。定义目录列表。 |
<div> | 定义文档中的节 |
<dl> | 定义列表详情 |
<dt> | 定义列表中的项目 |
<em> | 定义强调文本 |
<embed>New | 定义嵌入的内容,比如插件。 |
<fieldset> | 定义围绕表单中元素的边框 |
<figcaption>New | 定义<figure> 元素的标题 |
<figure>New | 规定独立的流内容(图像、图表、照片、代码等等)。 |
<font> | HTML5不支持,不赞成使用。定义文字的字体、尺寸和颜色。 |
<footer>New | 定义 section 或 document 的页脚。 |
<form> | 定义了HTML文档的表单 |
<frame> | 定义框架集的窗口或框架 |
<frameset> | 定义框架集 |
<h1> to <h6> | 定义 HTML 标题 |
<head> | 定义关于文档的信息 |
<header>New | 定义了文档的头部区域 |
<hr> | 定义水平线 |
<html> | 定义 HTML 文档 |
<i> | 定义斜体字 |
<iframe> | 定义内联框架 |
<img> | 定义图像 |
<input> | 定义输入控件 |
<ins> | 定义被插入文本 |
<kbd> | 定义键盘文本 |
<keygen>New | 规定用于表单的密钥对生成器字段。 |
<label> | 定义 input 元素的标注 |
<legend> | 定义 fieldset 元素的标题。 |
<li> | 定义列表的项目 |
<link> | 定义文档与外部资源的关系 |
<map> | 定义图像映射 |
<mark>New | 定义带有记号的文本。请在需要突出显示文本时使用 <m> 标签。 |
<menu> | 不赞成使用。定义菜单列表。 |
<meta> | 定义关于 HTML 文档的元信息。 |
<meter>New | 定义度量衡。仅用于已知最大和最小值的度量。 |
<nav>New | 定义导航链接的部分 |
<noframes> | 定义针对不支持框架的用户的替代内容。HTML5不支持 |
<noscript> | 定义针对不支持客户端脚本的用户的替代内容。 |
<object> | 定义内嵌对象 |
<ol> | 定义有序列表。 |
<optgroup> | 定义选择列表中相关选项的组合。 |
<option> | 定义选择列表中的选项。 |
<output>New | 定义不同类型的输出,比如脚本的输出。 |
<p> | 定义段落。 |
<param> | 定义对象的参数。 |
<pre> | 定义预格式文本。 |
<progress>New | 定义运行中的进度(进程)。 |
<q> | 定义短的引用。 |
<rp>New | <rp> 标签在 ruby 注释中使用,以定义不支持 ruby 元素的浏览器所显示的内容。 |
<rt>New | <rt> 标签定义字符(中文注音或字符)的解释或发音。 |
<ruby>New | <ruby> 标签定义 ruby 注释(中文注音或字符)。 |
<s> | 不赞成使用。定义加删除线的文本。 |
<samp> | 定义计算机代码样本。 |
<script> | 定义客户端脚本。 |
<section>New | <section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。 |
<select> | 定义选择列表(下拉列表)。 |
<small> | 定义小号文本。 |
<source>New | <source> 标签为媒介元素(比如 <video> 和 <audio>)定义媒介资源。 |
<span> | 定义文档中的节。 |
<strike> | HTML5不支持,不赞成使用。定义加删除线文本。 |
<strong> | 定义强调文本。 |
<style> | 定义文档的样式信息。 |
<sub> | 定义下标文本。 |
<summary>New | <summary> 标签包含 details 元素的标题,"details" 元素用于描述有关文档或文档片段的详细信息。 |
<sup> | 定义上标文本。 |
<table> | 定义表格。 |
<tbody> | 定义表格中的主体内容。 |
<td> | 定义表格中的单元。 |
<textarea> | 定义多行的文本输入控件。 |
<tfoot> | 定义表格中的表注内容(脚注)。 |
<th> | 定义表格中的表头单元格。 |
<thead> | 定义表格中的表头内容。 |
<time>New | 定义日期或时间,或者两者。 |
<title> | 定义文档的标题。 |
<tr> | 定义表格中的行。 |
<track>New | <track> 标签为诸如 video 元素之类的媒介规定外部文本轨道。 |
<tt> | 定义打字机文本。 |
<u> | 不赞成使用。定义下划线文本。 |
<ul> | 定义无序列表。 |
<var> | 定义文本的变量部分。 |
<video>New | <video> 标签定义视频,比如电影片段或其他视频流。 |
<wbr>New | 规定在文本中的何处适合添加换行符。 |
功能排序
New : HTML5 新标签
标签 | 描述 |
---|---|
基础 | |
<!DOCTYPE> | 定义文档类型。 |
<html> | 定义一个 HTML 文档 |
<title> | 为文档定义一个标题 |
<body> | 定义文档的主体 |
<h1> to <h6> | 定义 HTML 标题 |
<p> | 定义一个段落 |
<br> | 定义简单的折行。 |
<hr> | 定义水平线。 |
<!--...--> | 定义一个注释 |
格式 | |
<acronym> | HTML5不再支持。 定义只取首字母的缩写。 |
<abbr> | 定义一个缩写。 |
<address> | 定义文档作者或拥有者的联系信息。 |
<b> | 定义粗体文本。 |
<bdi>New | 允许您设置一段文本,使其脱离其父元素的文本方向设置。 |
<bdo> | 定义文本的方向。 |
<big> | HTML5不再支持。 定义大号文本。 |
<blockquote> | 定义块引用。 |
<center> | HTML5不再支持。 HTML 4.01 已废弃。定义居中文本。 |
<cite> | 定义引用(citation)。 |
<code> | 定义计算机代码文本。 |
<del> | 定义被删除文本。 |
<dfn> | 定义定义项目。 |
<em> | 定义强调文本。 |
<font> | HTML5不再支持。 HTML 4.01 已废弃。 定义文本的字体、尺寸和颜色 |
<i> | 定义斜体文本。 |
<ins> | 定义被插入文本。 |
<kbd> | 定义键盘文本。 |
<mark>New | 定义带有记号的文本。 |
<meter>New | 定义度量衡。仅用于已知最大和最小值的度量。 |
<pre> | 定义预格式文本 |
<progress>New | 定义运行中的任务进度(进程)。 |
<q> | 定义短的引用。 |
<rp>New | 定义不支持 ruby 元素的浏览器所显示的内容。 |
<rt>New | 定义字符(中文注音或字符)的解释或发音。 |
<ruby>New | 定义 ruby 注释(中文注音或字符)。 |
<s> | 定义加删除线的文本。 |
<samp> | 定义计算机代码样本。 |
<small> | 定义小号文本。 |
<strike> | HTML5不再支持。 HTML 4.01 已废弃。 定义加删除线的文本。 |
<strong> | 定义语气更为强烈的强调文本。 |
<sub> | 定义下标文本。 |
<sup> | 定义上标文本。 |
<time>New | 定义一个日期/时间 |
<tt> | HTML5不再支持。 定义打字机文本。 |
<u> | 定义下划线文本。 |
<var> | 定义文本的变量部分。 |
<wbr>New | 规定在文本中的何处适合添加换行符。 |
表单 | |
<form> | 定义一个 HTML 表单,用于用户输入。 |
<input> | 定义一个输入控件 |
<textarea> | 定义多行的文本输入控件。 |
<button> | 定义按钮。 |
<select> | 定义选择列表(下拉列表)。 |
<optgroup> | 定义选择列表中相关选项的组合。 |
<option> | 定义选择列表中的选项。 |
<label> | 定义 input 元素的标注。 |
<fieldset> | 定义围绕表单中元素的边框。 |
<legend> | 定义 fieldset 元素的标题。 |
<datalist>New | 规定了 input 元素可能的选项列表。 |
<keygen>New | 规定用于表单的密钥对生成器字段。 |
<output>New | 定义一个计算的结果 |
框架 | |
<frame> | HTML5不再支持。 定义框架集的窗口或框架。 |
<frameset> | HTML5不再支持。定义框架集。 |
<noframes> | HTML5不再支持。 定义针对不支持框架的用户的替代内容。 |
<iframe> | 定义内联框架。 |
图像 | |
<img> | 定义图像。 |
<map> | 定义图像映射。 |
<area> | 定义图像地图内部的区域。 |
<canvas>New | 通过脚本(通常是 JavaScript)来绘制图形(比如图表和其他图像)。 |
<figcaption>New | 定义一个 caption for a <figure> element |
<figure>New | figure 标签用于对元素进行组合。 |
Audio/Video | |
<audio>New | 定义声音,比如音乐或其他音频流。 |
<source>New | 定义media元素 (<video> 和 <audio>)的媒体资源。media |
<track>New | 为媒体(<video> 和 <audio>)元素定义外部文本轨道。 |
<video>New | 定义一个音频或者视频 |
链接 | |
<a> | 定义一个链接 |
<link> | 定义文档与外部资源的关系。 |
<nav>New | 定义导航链接 |
列表 | |
<ul> | 定义一个无序列表 |
<ol> | 定义一个有序列表 |
<li> | 定义一个列表项 |
<dir> | HTML5不再支持。 HTML 4.01 已废弃。 定义目录列表。 |
<dl> | 定义一个定义列表 |
<dt> | 定义一个定义定义列表中的项目。 |
<dd> | 定义定义列表中项目的描述。 |
<menu> | 定义菜单列表。 |
<command>New | 定义用户可能调用的命令(比如单选按钮、复选框或按钮)。 |
表格 | |
<table> | 定义一个表格 |
<caption> | 定义表格标题。 |
<th> | 定义表格中的表头单元格。 |
<tr> | 定义表格中的行。 |
<td> | 定义表格中的单元。 |
<thead> | 定义表格中的表头内容。 |
<tbody> | 定义表格中的主体内容。 |
<tfoot> | 定义表格中的表注内容(脚注)。 |
<col> | 定义表格中一个或多个列的属性值。 |
<colgroup> | 定义表格中供格式化的列组。 |
样式/节 | |
<style> | 定义文档的样式信息。 |
<div> | 定义文档中的节。 |
<span> | 定义文档中的节。 |
<header>New | 定义一个文档头部部分 |
<footer>New | 定义一个文档底部 |
<section>New | 定义了文档的某个区域 |
<article>New | 定义一个文章内容 |
<aside>New | 定义其所处内容之外的内容。 |
<details>New | 定义了用户可见的或者隐藏的需求的补充细节。 |
<dialog>New | 定义一个对话框或者窗口 |
<summary>New | 定义一个可见的标题。 当用户点击标题时会显示出详细信息。 |
元信息 | |
<head> | 定义关于文档的信息 |
<meta> | 定义关于 HTML 文档的元信息。 |
<base> | 定义页面中所有链接的默认地址或默认目标。 |
<basefont> | HTML5不再支持。 HTML 4.01 已废弃。 定义页面中文本的默认字体、颜色或尺寸。 |
程序 | |
<script> | 定义客户端脚本。 |
<noscript> | 定义针对不支持客户端脚本的用户的替代内容。 |
<applet> | HTML5不再支持。 HTML 4.01 已废弃。 定义嵌入的 applet。 |
<embed>New | 定义了一个容器,用来嵌入外部应用或者互动程序(插件)。 |
<object> | 定义嵌入的对象。 |
<param> | 定义对象的参数。 |
HTML 全局属性
New : HTML5 新属性。
属性 | 描述 |
---|---|
accesskey | 设置访问元素的键盘快捷键。 |
class | 规定元素的类名(classname) |
contenteditableNew | 规定是否可编辑元素的内容。 |
contextmenuNew | 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单 |
data-*New | 用于存储页面的自定义数据 |
dir | 设置元素中内容的文本方向。 |
draggableNew | 指定某个元素是否可以拖动 |
dropzoneNew | 指定是否将数据复制,移动,或链接,或删除 |
hiddenNew | hidden 属性规定对元素进行隐藏。 |
id | 规定元素的唯一 id |
lang | 设置元素中内容的语言代码。 |
spellcheckNew | 检测元素是否拼写错误 |
style | 规定元素的行内样式(inline style) |
tabindex | 设置元素的 Tab 键控制次序。 |
title | 规定元素的额外信息(可在工具提示中显示) |
translateNew | 指定是否一个元素的值在页面载入时是否需要翻译 |
窗口事件属性(Window Event Attributes)
由窗口触发该事件 (适用于 <body> 标签):
属性 | 值 | 描述 |
---|---|---|
onafterprintNew | script | 在打印文档之后运行脚本 |
onbeforeprintNew | script | 在文档打印之前运行脚本 |
onbeforeonloadNew | script | 在文档加载之前运行脚本 |
onblur | script | 当窗口失去焦点时运行脚本 |
onerrorNew | script | 当错误发生时运行脚本 |
onfocus | script | 当窗口获得焦点时运行脚本 |
onhaschangeNew | script | 当文档改变时运行脚本 |
onload | script | 当文档加载时运行脚本 |
onmessageNew | script | 当触发消息时运行脚本 |
onofflineNew | script | 当文档离线时运行脚本 |
ononlineNew | script | 当文档上线时运行脚本 |
onpagehideNew | script | 当窗口隐藏时运行脚本 |
onpageshowNew | script | 当窗口可见时运行脚本 |
onpopstateNew | script | 当窗口历史记录改变时运行脚本 |
onredoNew | script | 当文档执行再执行操作(redo)时运行脚本 |
onresizeNew | script | 当调整窗口大小时运行脚本 |
onstorageNew | script | 当 Web Storage 区域更新时(存储空间中的数据发生变化时)运行脚本 |
onundoNew | script | 当文档执行撤销时运行脚本 |
onunloadNew | script | 当用户离开文档时运行脚本 |
表单事件(Form Events)
表单事件在HTML表单中触发 (适用于所有 HTML 元素, 但该HTML元素需在form表单内):
属性 | 值 | 描述 |
---|---|---|
onblur | script | 当元素失去焦点时运行脚本 |
onchange | script | 当元素改变时运行脚本 |
oncontextmenuNew | script | 当触发上下文菜单时运行脚本 |
onfocus | script | 当元素获得焦点时运行脚本 |
onformchangeNew | script | 当表单改变时运行脚本 |
onforminputNew | script | 当表单获得用户输入时运行脚本 |
oninputNew | script | 当元素获得用户输入时运行脚本 |
oninvalidNew | script | 当元素无效时运行脚本 |
onreset | script | 当表单重置时运行脚本。HTML 5 不支持。 |
onselect | script | 当选取元素时运行脚本 |
onsubmit | script | 当提交表单时运行脚本 |
键盘事件(Keyboard Events)
属性 | 值 | 描述 |
---|---|---|
onkeydown | script | 当按下按键时运行脚本 |
onkeypress | script | 当按下并松开按键时运行脚本 |
onkeyup | script | 当松开按键时运行脚本 |
鼠标事件(Mouse Events)
通过鼠标触发事件, 类似用户的行为:
属性 | 值 | 描述 |
---|---|---|
onclick | script | 当单击鼠标时运行脚本 |
ondblclick | script | 当双击鼠标时运行脚本 |
ondragNew | script | 当拖动元素时运行脚本 |
ondragendNew | script | 当拖动操作结束时运行脚本 |
ondragenterNew | script | 当元素被拖动至有效的拖放目标时运行脚本 |
ondragleaveNew | script | 当元素离开有效拖放目标时运行脚本 |
ondragoverNew | script | 当元素被拖动至有效拖放目标上方时运行脚本 |
ondragstartNew | script | 当拖动操作开始时运行脚本 |
ondropNew | script | 当被拖动元素正在被拖放时运行脚本 |
onmousedown | script | 当按下鼠标按钮时运行脚本 |
onmousemove | script | 当鼠标指针移动时运行脚本 |
onmouseout | script | 当鼠标指针移出元素时运行脚本 |
onmouseover | script | 当鼠标指针移至元素之上时运行脚本 |
onmouseup | script | 当松开鼠标按钮时运行脚本 |
onmousewheelNew | script | 当转动鼠标滚轮时运行脚本 |
onscrollNew | script | 当滚动元素的滚动条时运行脚本 |
多媒体事件(Media Events)
通过视频(videos),图像(images)或者音频(audio) 触发该事件,多应用于HTML媒体元素比如 <audio>, <embed>, <img>, <object>, 和<video>):
属性 | 值 | 描述 |
---|---|---|
onabort | script | 当发生中止事件时运行脚本 |
oncanplayNew | script | 当媒介能够开始播放但可能因缓冲而需要停止时运行脚本 |
oncanplaythroughNew | script | 当媒介能够无需因缓冲而停止即可播放至结尾时运行脚本 |
ondurationchangeNew | script | 当媒介长度改变时运行脚本 |
onemptiedNew | script | 当媒介资源元素突然为空时(网络错误、加载错误等)运行脚本 |
onendedNew | script | 当媒介已抵达结尾时运行脚本 |
onerrorNew | script | 当在元素加载期间发生错误时运行脚本 |
onloadeddataNew | script | 当加载媒介数据时运行脚本 |
onloadedmetadataNew | script | 当媒介元素的持续时间以及其他媒介数据已加载时运行脚本 |
onloadstartNew | script | 当浏览器开始加载媒介数据时运行脚本 |
onpauseNew | script | 当媒介数据暂停时运行脚本 |
onplayNew | script | 当媒介数据将要开始播放时运行脚本 |
onplayingNew | script | 当媒介数据已开始播放时运行脚本 |
onprogressNew | script | 当浏览器正在取媒介数据时运行脚本 |
onratechangeNew | script | 当媒介数据的播放速率改变时运行脚本 |
onreadystatechangeNew | script | 当就绪状态(ready-state)改变时运行脚本 |
onseekedNew | script | 当媒介元素的定位属性 [1] 不再为真且定位已结束时运行脚本 |
onseekingNew | script | 当媒介元素的定位属性为真且定位已开始时运行脚本 |
onstalledNew | script | 当取回媒介数据过程中(延迟)存在错误时运行脚本 |
onsuspendNew | script | 当浏览器已在取媒介数据但在取回整个媒介文件之前停止时运行脚本 |
ontimeupdateNew | script | 当媒介改变其播放位置时运行脚本 |
onvolumechangeNew | script | 当媒介改变音量亦或当音量被设置为静音时运行脚本 |
onwaitingNew | script | 当媒介已停止播放但打算继续播放时运行脚本 |
其他事件
属性 | 值 | 描述 |
---|---|---|
onshowNew | script | 当 <menu> 元素在上下文显示时触发 |
ontoggleNew | script | 当用户打开或关闭 <details> 元素时触发 |
canvas描述
HTML5 <canvas> 标签用于绘制图像(通过脚本,通常是 JavaScript)。
不过,<canvas> 元素本身并没有绘制能力(它仅仅是图形的容器) - 您必须使用脚本来完成实际的绘图任务。
getContext() 方法可返回一个对象,该对象提供了用于在画布上绘图的方法和属性。
本手册提供完整的 getContext("2d") 对象的属性和方法,可用于在画布上绘制文本、线条、矩形、圆形等等。
浏览器支持
Internet Explorer 9、Firefox、Opera、Chrome 和 Safari 支持 <canvas> 标签的属性及方法。
注意:Internet Explorer 8 及更早的IE版本不支持 <canvas> 元素。
颜色、样式和阴影
属性 | 描述 |
---|---|
fillStyle | 设置或返回用于填充绘画的颜色、渐变或模式。 |
strokeStyle | 设置或返回用于笔触的颜色、渐变或模式。 |
shadowColor | 设置或返回用于阴影的颜色。 |
shadowBlur | 设置或返回用于阴影的模糊级别。 |
shadowOffsetX | 设置或返回阴影与形状的水平距离。 |
shadowOffsetY | 设置或返回阴影与形状的垂直距离。 |
方法 | 描述 |
---|---|
createLinearGradient() | 创建线性渐变(用在画布内容上)。 |
createPattern() | 在指定的方向上重复指定的元素。 |
createRadialGradient() | 创建放射状/环形的渐变(用在画布内容上)。 |
addColorStop() | 规定渐变对象中的颜色和停止位置。 |
线条样式
属性 | 描述 |
---|---|
lineCap | 设置或返回线条的结束端点样式。 |
lineJoin | 设置或返回两条线相交时,所创建的拐角类型。 |
lineWidth | 设置或返回当前的线条宽度。 |
miterLimit | 设置或返回最大斜接长度。 |
矩形
方法 | 描述 |
---|---|
rect() | 创建矩形。 |
fillRect() | 绘制"被填充"的矩形。 |
strokeRect() | 绘制矩形(无填充)。 |
clearRect() | 在给定的矩形内清除指定的像素。 |
路径
方法 | 描述 |
---|---|
fill() | 填充当前绘图(路径)。 |
stroke() | 绘制已定义的路径。 |
beginPath() | 起始一条路径,或重置当前路径。 |
moveTo() | 把路径移动到画布中的指定点,不创建线条。 |
closePath() | 创建从当前点回到起始点的路径。 |
lineTo() | 添加一个新点,然后在画布中创建从该点到最后指定点的线条。 |
clip() | 从原始画布剪切任意形状和尺寸的区域。 |
quadraticCurveTo() | 创建二次贝塞尔曲线。 |
bezierCurveTo() | 创建三次贝塞尔曲线。 |
arc() | 创建弧/曲线(用于创建圆形或部分圆)。 |
arcTo() | 创建两切线之间的弧/曲线。 |
isPointInPath() | 如果指定的点位于当前路径中,则返回 true,否则返回 false。 |
转换
方法 | 描述 |
---|---|
scale() | 缩放当前绘图至更大或更小。 |
rotate() | 旋转当前绘图。 |
translate() | 重新映射画布上的 (0,0) 位置。 |
transform() | 替换绘图的当前转换矩阵。 |
setTransform() | 将当前转换重置为单位矩阵。然后运行 transform()。 |
文本
属性 | 描述 |
---|---|
font | 设置或返回文本内容的当前字体属性。 |
textAlign | 设置或返回文本内容的当前对齐方式。 |
textBaseline | 设置或返回在绘制文本时使用的当前文本基线。 |
方法 | 描述 |
---|---|
fillText() | 在画布上绘制"被填充的"文本。 |
strokeText() | 在画布上绘制文本(无填充)。 |
measureText() | 返回包含指定文本宽度的对象。 |
图像绘制
方法 | 描述 |
---|---|
drawImage() | 向画布上绘制图像、画布或视频。 |
像素操作
属性 | 描述 |
---|---|
width | 返回 ImageData 对象的宽度。 |
height | 返回 ImageData 对象的高度。 |
data | 返回一个对象,其包含指定的 ImageData 对象的图像数据。 |
方法 | 描述 |
---|---|
createImageData() | 创建新的、空白的 ImageData 对象。 |
getImageData() | 返回 ImageData 对象,该对象为画布上指定的矩形复制像素数据。 |
putImageData() | 把图像数据(从指定的 ImageData 对象)放回画布上。 |
合成
属性 | 描述 |
---|---|
globalAlpha | 设置或返回绘图的当前 alpha 或透明值。 |
globalCompositeOperation | 设置或返回新图像如何绘制到已有的图像上。 |
其他
方法 | 描述 |
---|---|
save() | 保存当前环境的状态。 |
restore() | 返回之前保存过的路径状态和属性。 |
createEvent() | |
getContext() | |
toDataURL() |
HTML 音频/视频 DOM 参考手册
HTML 音频/视频 DOM 参考手册
HTML5 DOM 为 <audio> 和 <video> 元素提供了方法、属性和事件。
这些方法、属性和事件允许您使用 JavaScript 来操作 <audio> 和 <video> 元素。
HTML 音频/视频 方法
方法 | 描述 |
---|---|
addTextTrack() | 向音频/视频添加新的文本轨道。 |
canPlayType() | 检测浏览器是否能播放指定的音频/视频类型。 |
load() | 重新加载音频/视频元素。 |
play() | 开始播放音频/视频。 |
pause() | 暂停当前播放的音频/视频。 |
属性 | 描述 |
---|---|
audioTracks | 返回表示可用音频轨道的 AudioTrackList 对象。 |
autoplay | 设置或返回是否在加载完成后随即播放音频/视频。 |
buffered | 返回表示音频/视频已缓冲部分的 TimeRanges 对象。 |
controller | 返回表示音频/视频当前媒体控制器的 MediaController 对象。 |
controls | 设置或返回音频/视频是否显示控件(比如播放/暂停等)。 |
crossOrigin | 设置或返回音频/视频的 CORS 设置。 |
currentSrc | 返回当前音频/视频的 URL。 |
currentTime | 设置或返回音频/视频中的当前播放位置(以秒计)。 |
defaultMuted | 设置或返回音频/视频默认是否静音。 |
defaultPlaybackRate | 设置或返回音频/视频的默认播放速度。 |
duration | 返回当前音频/视频的长度(以秒计)。 |
ended | 返回音频/视频的播放是否已结束。 |
error | 返回表示音频/视频错误状态的 MediaError 对象。 |
loop | 设置或返回音频/视频是否应在结束时重新播放。 |
mediaGroup | 设置或返回音频/视频所属的组合(用于连接多个音频/视频元素)。 |
muted | 设置或返回音频/视频是否静音。 |
networkState | 返回音频/视频的当前网络状态。 |
paused | 设置或返回音频/视频是否暂停。 |
playbackRate | 设置或返回音频/视频播放的速度。 |
played | 返回表示音频/视频已播放部分的 TimeRanges 对象。 |
preload | 设置或返回音频/视频是否应该在页面加载后进行加载。 |
readyState | 返回音频/视频当前的就绪状态。 |
seekable | 返回表示音频/视频可寻址部分的 TimeRanges 对象。 |
seeking | 返回用户是否正在音频/视频中进行查找。 |
src | 设置或返回音频/视频元素的当前来源。 |
startDate | 返回表示当前时间偏移的 Date 对象。 |
textTracks | 返回表示可用文本轨道的 TextTrackList 对象。 |
videoTracks | 返回表示可用视频轨道的 VideoTrackList 对象。 |
volume | 设置或返回音频/视频的音量。 |
事件 | 描述 |
---|---|
abort | 当音频/视频的加载已放弃时触发。 |
canplay | 当浏览器可以开始播放音频/视频时触发。 |
canplaythrough | 当浏览器可在不因缓冲而停顿的情况下进行播放时触发。 |
durationchange | 当音频/视频的时长已更改时触发。 |
emptied | 当目前的播放列表为空时触发。 |
ended | 当目前的播放列表已结束时触发。 |
error | 当在音频/视频加载期间发生错误时触发。 |
loadeddata | 当浏览器已加载音频/视频的当前帧时触发。 |
loadedmetadata | 当浏览器已加载音频/视频的元数据时触发。 |
loadstart | 当浏览器开始查找音频/视频时触发。 |
pause | 当音频/视频已暂停时触发。 |
play | 当音频/视频已开始或不再暂停时触发。 |
playing | 当音频/视频在因缓冲而暂停或停止后已就绪时触发。 |
progress | 当浏览器正在下载音频/视频时触发。 |
ratechange | 当音频/视频的播放速度已更改时触发。 |
seeked | 当用户已移动/跳跃到音频/视频中的新位置时触发。 |
seeking | 当用户开始移动/跳跃到音频/视频中的新位置时触发。 |
stalled | 当浏览器尝试获取媒体数据,但数据不可用时触发。 |
suspend | 当浏览器刻意不获取媒体数据时触发。 |
timeupdate | 当目前的播放位置已更改时触发。 |
volumechange | 当音量已更改时触发。 |
waiting | 当视频由于需要缓冲下一帧而停止时触发。 |
HTML 元素和有效 DOCTYPES
HTML 元素 - 有效 DOCTYPES
下面的表格列出了所有的 HTML5/HTML 4.01/XHTML 元素,以及它们会出现在什么文档类型 (!DOCTYPE) 中:
HTML 4.01 / XHTML 1.0 | |||||
---|---|---|---|---|---|
Tag | HTML5 | Transitional | Strict | Frameset | XHTML 1.1 |
<a> | Yes | Yes | Yes | Yes | Yes |
<abbr> | Yes | Yes | Yes | Yes | Yes |
<acronym> | No | Yes | Yes | Yes | Yes |
<address> | Yes | Yes | Yes | Yes | Yes |
<applet> | No | Yes | No | Yes | No |
<area> | Yes | Yes | Yes | Yes | No |
<article> | Yes | No | No | No | No |
<aside> | Yes | No | No | No | No |
<audio> | Yes | No | No | No | No |
<b> | Yes | Yes | Yes | Yes | Yes |
<base> | Yes | Yes | Yes | Yes | Yes |
<basefont> | No | Yes | No | Yes | No |
<bdi> | Yes | No | No | No | No |
<bdo> | Yes | Yes | Yes | Yes | No |
<big> | No | Yes | Yes | Yes | Yes |
<blockquote> | Yes | Yes | Yes | Yes | Yes |
<body> | Yes | Yes | Yes | Yes | Yes |
<br> | Yes | Yes | Yes | Yes | Yes |
<button> | Yes | Yes | Yes | Yes | Yes |
<canvas> | Yes | No | No | No | No |
<caption> | Yes | Yes | Yes | Yes | Yes |
<center> | No | Yes | No | Yes | No |
<cite> | Yes | Yes | Yes | Yes | Yes |
<code> | Yes | Yes | Yes | Yes | Yes |
<col> | Yes | Yes | Yes | Yes | No |
<colgroup> | Yes | Yes | Yes | Yes | No |
<command> | Yes | No | No | No | No |
<datalist> | Yes | No | No | No | No |
<dd> | Yes | Yes | Yes | Yes | Yes |
<del> | Yes | Yes | Yes | Yes | No |
<details> | Yes | No | No | No | No |
<dfn> | Yes | Yes | Yes | Yes | Yes |
<dir> | No | Yes | No | Yes | No |
<div> | Yes | Yes | Yes | Yes | Yes |
<dl> | Yes | Yes | Yes | Yes | Yes |
<dt> | Yes | Yes | Yes | Yes | Yes |
<em> | Yes | Yes | Yes | Yes | Yes |
<embed> | Yes | No | No | No | No |
<fieldset> | Yes | Yes | Yes | Yes | Yes |
<figcaption> | Yes | No | No | No | No |
<figure> | Yes | No | No | No | No |
<font> | No | Yes | No | Yes | No |
<footer> | Yes | No | No | No | No |
<form> | Yes | Yes | Yes | Yes | Yes |
<frame> | No | No | No | Yes | No |
<frameset> | No | No | No | Yes | No |
<h1> to <h6> | Yes | Yes | Yes | Yes | Yes |
<head> | Yes | Yes | Yes | Yes | Yes |
<header> | Yes | No | No | No | No |
<hgroup> | Yes | No | No | No | No |
<hr> | Yes | Yes | Yes | Yes | Yes |
<html> | Yes | Yes | Yes | Yes | Yes |
<i> | Yes | Yes | Yes | Yes | Yes |
<iframe> | Yes | Yes | No | Yes | No |
<img> | Yes | Yes | Yes | Yes | Yes |
<input> | Yes | Yes | Yes | Yes | Yes |
<ins> | Yes | Yes | Yes | Yes | No |
<kbd> | Yes | Yes | Yes | Yes | Yes |
<keygen> | Yes | No | No | No | No |
<label> | Yes | Yes | Yes | Yes | Yes |
<legend> | Yes | Yes | Yes | Yes | Yes |
<li> | Yes | Yes | Yes | Yes | Yes |
<link> | Yes | Yes | Yes | Yes | Yes |
<map> | Yes | Yes | Yes | Yes | No |
<mark> | Yes | No | No | No | No |
<menu> | Yes | Yes | No | Yes | No |
<meta> | Yes | Yes | Yes | Yes | Yes |
<meter> | Yes | No | No | No | No |
<nav> | Yes | No | No | No | No |
<noframes> | No | Yes | No | Yes | No |
<noscript> | Yes | Yes | Yes | Yes | Yes |
<object> | Yes | Yes | Yes | Yes | Yes |
<ol> | Yes | Yes | Yes | Yes | Yes |
<optgroup> | Yes | Yes | Yes | Yes | Yes |
<option> | Yes | Yes | Yes | Yes | Yes |
<output> | Yes | No | No | No | No |
<p> | Yes | Yes | Yes | Yes | Yes |
<param> | Yes | Yes | Yes | Yes | Yes |
<pre> | Yes | Yes | Yes | Yes | Yes |
<progress> | Yes | No | No | No | No |
<q> | Yes | Yes | Yes | Yes | Yes |
<rp> | Yes | No | No | No | No |
<rt> | Yes | No | No | No | No |
<ruby> | Yes | No | No | No | No |
<s> | Yes | Yes | No | Yes | No |
<samp> | Yes | Yes | Yes | Yes | Yes |
<script> | Yes | Yes | Yes | Yes | Yes |
<section> | Yes | No | No | No | No |
<select> | Yes | Yes | Yes | Yes | Yes |
<small> | Yes | Yes | Yes | Yes | Yes |
<source> | Yes | No | No | No | No |
<span> | Yes | Yes | Yes | Yes | Yes |
<strike> | No | Yes | No | Yes | No |
<strong> | Yes | Yes | Yes | Yes | Yes |
<style> | Yes | Yes | Yes | Yes | Yes |
<sub> | Yes | Yes | Yes | Yes | Yes |
<summary> | Yes | No | No | No | No |
<sup> | Yes | Yes | Yes | Yes | Yes |
<table> | Yes | Yes | Yes | Yes | Yes |
<tbody> | Yes | Yes | Yes | Yes | No |
<td> | Yes | Yes | Yes | Yes | Yes |
<textarea> | Yes | Yes | Yes | Yes | Yes |
<tfoot> | Yes | Yes | Yes | Yes | No |
<th> | Yes | Yes | Yes | Yes | Yes |
<thead> | Yes | Yes | Yes | Yes | No |
<time> | Yes | No | No | No | No |
<title> | Yes | Yes | Yes | Yes | Yes |
<tr> | Yes | Yes | Yes | Yes | Yes |
<track> | Yes | No | No | No | No |
<tt> | No | Yes | Yes | Yes | Yes |
<u> | No | Yes | No | Yes | No |
<ul> | Yes | Yes | Yes | Yes | Yes |
<var> | Yes | Yes | Yes | Yes | Yes |
<video> | Yes | No | No | No | No |
<wbr> | Yes | No | No | No | No |
HTML 颜色名
目前所有浏览器都支持以下颜色名。
141个颜色名称是在HTML和CSS颜色规范定义的(17标准颜色,再加124)。下表列出了所有颜色的值,包括十六进制值。
提示: 17标准颜色:黑色,蓝色,水,紫红色,灰色,绿色,石灰,栗色,海军,橄榄,橙,紫,红,白,银,蓝绿色,黄色。点击其中一个颜色名称(或一个十六进制值)就可以查看与不同文字颜色搭配的背景颜色。:
按颜色名排序
单击一个颜色名或者 16 进制值,就可以查看与不同文字颜色搭配的背景颜色。
HTML 拾色器
选取颜色:或输入颜色值: | 选择的颜色:黑色文本 阴影 白色文本 阴影
red
#ff0000
rgb(255, 0, 0)
hsl(0, 100%, 50%)
hsv(0, 100%, 100%)
|
淡 / 暗:
|
Hue
Hue | Hex | Rgb | Hsl | Hsv | |
0 | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | |
15 | #ff4000 | rgb(255, 64, 0) | hsl(15, 100%, 50%) | hsv(15, 100%, 100%) | |
30 | #ff8000 | rgb(255, 128, 0) | hsl(30, 100%, 50%) | hsv(30, 100%, 100%) | |
45 | #ffbf00 | rgb(255, 191, 0) | hsl(45, 100%, 50%) | hsv(45, 100%, 100%) | |
60 | #ffff00 | rgb(255, 255, 0) | hsl(60, 100%, 50%) | hsv(60, 100%, 100%) | |
75 | #bfff00 | rgb(191, 255, 0) | hsl(75, 100%, 50%) | hsv(75, 100%, 100%) | |
90 | #80ff00 | rgb(128, 255, 0) | hsl(90, 100%, 50%) | hsv(90, 100%, 100%) | |
105 | #40ff00 | rgb(64, 255, 0) | hsl(105, 100%, 50%) | hsv(105, 100%, 100%) | |
120 | #00ff00 | rgb(0, 255, 0) | hsl(120, 100%, 50%) | hsv(120, 100%, 100%) | |
135 | #00ff40 | rgb(0, 255, 64) | hsl(135, 100%, 50%) | hsv(135, 100%, 100%) | |
150 | #00ff80 | rgb(0, 255, 128) | hsl(150, 100%, 50%) | hsv(150, 100%, 100%) | |
165 | #00ffbf | rgb(0, 255, 191) | hsl(165, 100%, 50%) | hsv(165, 100%, 100%) | |
180 | #00ffff | rgb(0, 255, 255) | hsl(180, 100%, 50%) | hsv(180, 100%, 100%) | |
195 | #00bfff | rgb(0, 191, 255) | hsl(195, 100%, 50%) | hsv(195, 100%, 100%) | |
210 | #007fff | rgb(0, 127, 255) | hsl(210, 100%, 50%) | hsv(210, 100%, 100%) | |
225 | #0040ff | rgb(0, 64, 255) | hsl(225, 100%, 50%) | hsv(225, 100%, 100%) | |
240 | #0000ff | rgb(0, 0, 255) | hsl(240, 100%, 50%) | hsv(240, 100%, 100%) | |
255 | #4000ff | rgb(64, 0, 255) | hsl(255, 100%, 50%) | hsv(255, 100%, 100%) | |
270 | #7f00ff | rgb(127, 0, 255) | hsl(270, 100%, 50%) | hsv(270, 100%, 100%) | |
285 | #bf00ff | rgb(191, 0, 255) | hsl(285, 100%, 50%) | hsv(285, 100%, 100%) | |
300 | #ff00ff | rgb(255, 0, 255) | hsl(300, 100%, 50%) | hsv(300, 100%, 100%) | |
315 | #ff00bf | rgb(255, 0, 191) | hsl(315, 100%, 50%) | hsv(315, 100%, 100%) | |
330 | #ff0080 | rgb(255, 0, 128) | hsl(330, 100%, 50%) | hsv(330, 100%, 100%) | |
345 | #ff0040 | rgb(255, 0, 64) | hsl(345, 100%, 50%) | hsv(345, 100%, 100%) | |
360 | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) |
HSL Saturation
Sat | Hex | Rgb | Hsl | Hsv | |
100% | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | |
95% | #f90606 | rgb(249, 6, 6) | hsl(0, 95%, 50%) | hsv(0, 97%, 98%) | |
90% | #f20d0d | rgb(242, 13, 13) | hsl(0, 90%, 50%) | hsv(0, 95%, 95%) | |
85% | #ec1313 | rgb(236, 19, 19) | hsl(0, 85%, 50%) | hsv(0, 92%, 93%) | |
80% | #e61919 | rgb(230, 25, 25) | hsl(0, 80%, 50%) | hsv(0, 89%, 90%) | |
75% | #df2020 | rgb(223, 32, 32) | hsl(0, 75%, 50%) | hsv(0, 86%, 88%) | |
70% | #d92626 | rgb(217, 38, 38) | hsl(0, 70%, 50%) | hsv(0, 82%, 85%) | |
65% | #d22d2d | rgb(210, 45, 45) | hsl(0, 65%, 50%) | hsv(0, 79%, 83%) | |
60% | #cc3333 | rgb(204, 51, 51) | hsl(0, 60%, 50%) | hsv(0, 75%, 80%) | |
55% | #c63939 | rgb(198, 57, 57) | hsl(0, 55%, 50%) | hsv(0, 71%, 78%) | |
50% | #bf4040 | rgb(191, 64, 64) | hsl(0, 50%, 50%) | hsv(0, 67%, 75%) | |
45% | #b94646 | rgb(185, 70, 70) | hsl(0, 45%, 50%) | hsv(0, 62%, 73%) | |
40% | #b34d4d | rgb(179, 77, 77) | hsl(0, 40%, 50%) | hsv(0, 57%, 70%) | |
35% | #ac5353 | rgb(172, 83, 83) | hsl(0, 35%, 50%) | hsv(0, 52%, 68%) | |
30% | #a65959 | rgb(166, 89, 89) | hsl(0, 30%, 50%) | hsv(0, 46%, 65%) | |
25% | #9f6060 | rgb(159, 96, 96) | hsl(0, 25%, 50%) | hsv(0, 40%, 63%) | |
20% | #996666 | rgb(153, 102, 102) | hsl(0, 20%, 50%) | hsv(0, 33%, 60%) | |
15% | #936c6c | rgb(147, 108, 108) | hsl(0, 15%, 50%) | hsv(0, 26%, 58%) | |
10% | #8c7373 | rgb(140, 115, 115) | hsl(0, 10%, 50%) | hsv(0, 18%, 55%) | |
5% | #867979 | rgb(134, 121, 121) | hsl(0, 5%, 50%) | hsv(0, 10%, 53%) | |
0% | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | hsv(0, 0%, 50%) |
HSL 淡 / 暗
Lum | Hex | Rgb | Hsl | Hsv | |
100% | #ffffff | rgb(255, 255, 255) | hsl(0, 0%, 100%) | hsv(0, 0%, 100%) | |
95% | #ffe5e5 | rgb(255, 229, 229) | hsl(0, 100%, 95%) | hsv(0, 10%, 100%) | |
90% | #ffcccc | rgb(255, 204, 204) | hsl(0, 100%, 90%) | hsv(0, 20%, 100%) | |
85% | #ffb3b3 | rgb(255, 179, 179) | hsl(0, 100%, 85%) | hsv(0, 30%, 100%) | |
80% | #ff9999 | rgb(255, 153, 153) | hsl(0, 100%, 80%) | hsv(0, 40%, 100%) | |
75% | #ff8080 | rgb(255, 128, 128) | hsl(0, 100%, 75%) | hsv(0, 50%, 100%) | |
70% | #ff6666 | rgb(255, 102, 102) | hsl(0, 100%, 70%) | hsv(0, 60%, 100%) | |
65% | #ff4d4d | rgb(255, 77, 77) | hsl(0, 100%, 65%) | hsv(0, 70%, 100%) | |
60% | #ff3333 | rgb(255, 51, 51) | hsl(0, 100%, 60%) | hsv(0, 80%, 100%) | |
55% | #ff1a1a | rgb(255, 26, 26) | hsl(0, 100%, 55%) | hsv(0, 90%, 100%) | |
50% | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | |
45% | #e60000 | rgb(230, 0, 0) | hsl(0, 100%, 45%) | hsv(0, 100%, 90%) | |
40% | #cc0000 | rgb(204, 0, 0) | hsl(0, 100%, 40%) | hsv(0, 100%, 80%) | |
35% | #b30000 | rgb(179, 0, 0) | hsl(0, 100%, 35%) | hsv(0, 100%, 70%) | |
30% | #990000 | rgb(153, 0, 0) | hsl(0, 100%, 30%) | hsv(0, 100%, 60%) | |
25% | #800000 | rgb(128, 0, 0) | hsl(0, 100%, 25%) | hsv(0, 100%, 50%) | |
20% | #660000 | rgb(102, 0, 0) | hsl(0, 100%, 20%) | hsv(0, 100%, 40%) | |
15% | #4d0000 | rgb(77, 0, 0) | hsl(0, 100%, 15%) | hsv(0, 100%, 30%) | |
10% | #330000 | rgb(51, 0, 0) | hsl(0, 100%, 10%) | hsv(0, 100%, 20%) | |
5% | #1a0000 | rgb(26, 0, 0) | hsl(0, 100%, 5%) | hsv(0, 100%, 10%) | |
0% | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | hsv(0, 0%, 0%) |
HSV Saturation
Sat | Hex | Rgb | Hsl | Hsv | |
100% | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | |
95% | #ff0d0d | rgb(255, 13, 13) | hsl(0, 100%, 53%) | hsv(0, 95%, 100%) | |
90% | #ff1919 | rgb(255, 25, 25) | hsl(0, 100%, 55%) | hsv(0, 90%, 100%) | |
85% | #ff2626 | rgb(255, 38, 38) | hsl(0, 100%, 57%) | hsv(0, 85%, 100%) | |
80% | #ff3333 | rgb(255, 51, 51) | hsl(0, 100%, 60%) | hsv(0, 80%, 100%) | |
75% | #ff4040 | rgb(255, 64, 64) | hsl(0, 100%, 63%) | hsv(0, 75%, 100%) | |
70% | #ff4d4d | rgb(255, 77, 77) | hsl(0, 100%, 65%) | hsv(0, 70%, 100%) | |
65% | #ff5959 | rgb(255, 89, 89) | hsl(0, 100%, 68%) | hsv(0, 65%, 100%) | |
60% | #ff6666 | rgb(255, 102, 102) | hsl(0, 100%, 70%) | hsv(0, 60%, 100%) | |
55% | #ff7373 | rgb(255, 115, 115) | hsl(0, 100%, 73%) | hsv(0, 55%, 100%) | |
50% | #ff8080 | rgb(255, 128, 128) | hsl(0, 100%, 75%) | hsv(0, 50%, 100%) | |
45% | #ff8c8c | rgb(255, 140, 140) | hsl(0, 100%, 78%) | hsv(0, 45%, 100%) | |
40% | #ff9999 | rgb(255, 153, 153) | hsl(0, 100%, 80%) | hsv(0, 40%, 100%) | |
35% | #ffa6a6 | rgb(255, 166, 166) | hsl(0, 100%, 83%) | hsv(0, 35%, 100%) | |
30% | #ffb3b3 | rgb(255, 179, 179) | hsl(0, 100%, 85%) | hsv(0, 30%, 100%) | |
25% | #ffbfbf | rgb(255, 191, 191) | hsl(0, 100%, 88%) | hsv(0, 25%, 100%) | |
20% | #ffcccc | rgb(255, 204, 204) | hsl(0, 100%, 90%) | hsv(0, 20%, 100%) | |
15% | #ffd9d9 | rgb(255, 217, 217) | hsl(0, 100%, 93%) | hsv(0, 15%, 100%) | |
10% | #ffe6e6 | rgb(255, 230, 230) | hsl(0, 100%, 95%) | hsv(0, 10%, 100%) | |
5% | #fff2f2 | rgb(255, 242, 242) | hsl(0, 100%, 98%) | hsv(0, 5%, 100%) | |
0% | #ffffff | rgb(255, 255, 255) | hsl(0, 0%, 100%) | hsv(0, 0%, 100%) |
HSV 亮 / 暗
Value | Hex | Rgb | Hsl | Hsv | |
100% | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | |
95% | #f20000 | rgb(242, 0, 0) | hsl(0, 100%, 48%) | hsv(0, 100%, 95%) | |
90% | #e60000 | rgb(230, 0, 0) | hsl(0, 100%, 45%) | hsv(0, 100%, 90%) | |
85% | #d90000 | rgb(217, 0, 0) | hsl(0, 100%, 43%) | hsv(0, 100%, 85%) | |
80% | #cc0000 | rgb(204, 0, 0) | hsl(0, 100%, 40%) | hsv(0, 100%, 80%) | |
75% | #bf0000 | rgb(191, 0, 0) | hsl(0, 100%, 38%) | hsv(0, 100%, 75%) | |
70% | #b30000 | rgb(179, 0, 0) | hsl(0, 100%, 35%) | hsv(0, 100%, 70%) | |
65% | #a60000 | rgb(166, 0, 0) | hsl(0, 100%, 33%) | hsv(0, 100%, 65%) | |
60% | #990000 | rgb(153, 0, 0) | hsl(0, 100%, 30%) | hsv(0, 100%, 60%) | |
55% | #8c0000 | rgb(140, 0, 0) | hsl(0, 100%, 28%) | hsv(0, 100%, 55%) | |
50% | #800000 | rgb(128, 0, 0) | hsl(0, 100%, 25%) | hsv(0, 100%, 50%) | |
45% | #730000 | rgb(115, 0, 0) | hsl(0, 100%, 23%) | hsv(0, 100%, 45%) | |
40% | #660000 | rgb(102, 0, 0) | hsl(0, 100%, 20%) | hsv(0, 100%, 40%) | |
35% | #590000 | rgb(89, 0, 0) | hsl(0, 100%, 18%) | hsv(0, 100%, 35%) | |
30% | #4d0000 | rgb(77, 0, 0) | hsl(0, 100%, 15%) | hsv(0, 100%, 30%) | |
25% | #400000 | rgb(64, 0, 0) | hsl(0, 100%, 13%) | hsv(0, 100%, 25%) | |
20% | #330000 | rgb(51, 0, 0) | hsl(0, 100%, 10%) | hsv(0, 100%, 20%) | |
15% | #260000 | rgb(38, 0, 0) | hsl(0, 100%, 8%) | hsv(0, 100%, 15%) | |
10% | #1a0000 | rgb(26, 0, 0) | hsl(0, 100%, 5%) | hsv(0, 100%, 10%) | |
5% | #0d0000 | rgb(13, 0, 0) | hsl(0, 100%, 3%) | hsv(0, 100%, 5%) | |
0% | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | hsv(0, 0%, 0%) |
RGB (Red, Green, Blue)
Red | Green | Blue |
---|---|---|
255 | 0 | 0 |
HTML 字符集
HTML 字符集
如需正确地显示 HTML 页面,浏览器必须知道使用何种字符集。
万维网早期使用的字符集是 ASCII。ASCII 支持 0-9 的数字,大写和小写英文字母表,以及一些特殊字符。
完整的 ASCII 参考手册。
由于很多国家使用的字符并不属于 ASCII,现代浏览器的默认字符集是 ISO-8859-1。
完整的 ISO-8859-1 参考手册。
如果网页使用不同于 ISO-8859-1 的字符集,就应该在 <meta> 标签进行指定。
尝试一下
ISO 字符集
ISO 字符集是国际标准组织 (ISO) 针对不同的字母表/语言定义的标准字符集。
下面列出了世界各地使用的不同字符集:
字符集 | 描述 | 使用范围 |
---|---|---|
ISO-8859-1 | Latin alphabet part 1 | 北美、西欧、拉丁美洲、加勒比海、加拿大、非洲 |
ISO-8859-2 | Latin alphabet part 2 | 东欧 |
ISO-8859-3 | Latin alphabet part 3 | SE Europe、世界语、其他杂项 |
ISO-8859-4 | Latin alphabet part 4 | 斯堪的纳维亚/波罗的海(以及其他没有包括在 ISO-8859-1 中的部分) |
ISO-8859-5 | Latin/Cyrillic part 5 | 使用古代斯拉夫语字母表的语言,比如保加利亚语、白俄罗斯文、俄罗斯语、马其顿语 |
ISO-8859-6 | Latin/Arabic part 6 | 使用阿拉伯字母的语言 |
ISO-8859-7 | Latin/Greek part 7 | 现代希腊语,以及由希腊语衍生的数学符号 |
ISO-8859-8 | Latin/Hebrew part 8 | 使用希伯来语的语言 |
ISO-8859-9 | Latin 5 part 9 | 土耳其语。除了土耳其字符取代了冰岛文字,其它与 ISO-8859-1 相同。 |
ISO-8859-10 | Latin 6 | 拉普兰语、日耳曼语、爱斯基摩北欧语 |
ISO-8859-15 | Latin 9 (aka Latin 0) | 与 ISO 8859-1 类似,欧元符号和其他一些字符取代了一些较少使用的符号 |
ISO-2022-JP | Latin/Japanese part 1 | 日本语 |
ISO-2022-JP-2 | Latin/Japanese part 2 | 日本语 |
ISO-2022-KR | Latin/Korean part 1 | 韩语 |
Unicode 标准
由于上面列出的字符集都有容量限制,而且不兼容多语言环境,Unicode 联盟开发了 Unicode 标准。
Unicode 标准涵盖了世界上的所有字符、标点和符号。
不论是何种平台、程序或语言,Unicode 都能够进行文本数据的处理、存储和交换。
Unicode 联盟
Unicode 联盟开发了 Unicode 标准。他们的目标是用标准的 Unicode 转换格式 (UTF) 来取代现有的字符集。
Unicode 标准已经获得了成功,在 XML、Java、ECMAScript (JavaScript)、LDAP、CORBA 3.0、WML 中,Unicode 已经得到了实现。在许多操作系统以及所有的现代浏览器中,Unicode 同样得到了支持。
Unicode 联盟与领导性的标准发展组织进行合作,比如 ISO、W3C 以及 ECMA。
Unicode 可以被不同的字符集兼容。最常用的编码方式是 UTF-8 和 UTF-16:
字符集 | 描述 |
---|---|
UTF-8 | UTF8 中的字符可以是 1-4 个字节长。UTF-8 可以表示 Unicode 标准中的任意字符。UTF-8 向后兼容 ASCII。UTF-8 是网页和电子邮件的首选编码。 |
UTF-16 | 16 比特的 Unicode 转换格式是一种 Unicode 可变字符编码,能够对全部 Unicode 指令表进行编码。UTF-16 主要被用于操作系统和环境中,比如微软的 Windows 2000/XP/2003/Vista/CE 以及 Java 和 .NET 字节代码环境。 |
提示: 所有 HTML 4 处理器均已支持 UTF-8,而所有 XHTML 和 XML 处理器支持 UTF-8 和 UTF-16!