html全局属性
全局属性是可与所有 HTML 元素一起使用的属性。
第一列 | 第二列 |
---|---|
accesskey | 规定激活元素的快捷键。 |
class | 规定元素的一个或多个类名(引用样式表中的类)。 |
contenteditable | 规定元素内容是否可编辑。 |
contextmenu | 规定元素的上下文菜单。上下文菜单在用户点击元素时显示。 |
data-* | 用于存储页面或应用程序的私有定制数据。 |
dir | 规定元素中内容的文本方向。 |
draggable | 规定元素是否可拖动。 |
dropzone | 规定在拖动被拖动数据时是否进行复制、移动或链接。 |
hidden | 规定元素仍未或不再相关。 |
id | 规定元素的唯一 id。 |
lang | 规定元素内容的语言。 |
spellcheck | 规定是否对元素进行拼写和语法检查。 |
style | 规定元素的行内 CSS 样式。 |
tabindex | 规定元素的 tab 键次序。 |
title | 规定有关元素的额外信息。 |
translate | 规定是否应该翻译元素内容。 |
accesskey
定义和用法
accesskey 属性规定激活(使元素获得焦点)元素的快捷键。
<!DOCTYPE html>
<html>
<body>
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML 教程</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS 教程</a>
<p><b>注释:</b>请使用Alt + <i>accessKey</i> (或者 Shift + Alt + <i>accessKey</i>) 来访问带有指定快捷键的元素。</p>
</body>
</html>
class
定义和用法
class 属性规定元素的类名(classname)。
提示和注释
注释:class 属性不能在以下 HTML 元素中使用:base, head, html, meta, param, script, style 以及 title。
提示:可以给 HTML 元素赋予多个 class,例如:<span class="left_menu important">
这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示:类名不能以数字开头!只有 Internet Explorer 支持这种做法。
contenteditable
定义和用法
contenteditable 属性规定元素内容是否可编辑。
注释:如果元素未设置 contenteditable 属性,那么元素会从其父元素继承该属性。
<!DOCTYPE HTML>
<html>
<body>
<p contenteditable="true">这是一段可编辑的段落。请试着编辑该文本。</p>
</body>
</html>
contextmenu
定义和用法
contextmenu 属性规定元素的上下文菜单。当用户右键点击元素时,会出现上下文菜单。
contextmenu 属性的值是要打开的 <menu>
元素的 id。
data-*
定义和用法
data-* 属性用于存储页面或应用程序的私有自定义数据。
data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。
存储的(自定义)数据能够被页面的 JavaScript 中利用,以创建更好的用户体验(不进行 Ajax 调用或服务器端数据库查询)。
data-* 属性包括两部分:
属性名不应该包含任何大写字母,并且在前缀 “data-” 之后必须有至少一个字符
属性值可以是任意字符串
注释:用户代理会完全忽略前缀为 “data-” 的自定义属性。
<!DOCTYPE html>
<html>
<head>
<script>
function showDetails(animal) {
var animalType = animal.getAttribute("data-animal-type");
alert(animal.innerHTML + "是一种" + animalType + "。");
}
</script>
</head>
<body>
<h1>物种</h1>
<p>点击某个物种来查看其类别:</p>
<ul>
<li onclick="showDetails(this)" id="owl" data-animal-type="鸟类">喜鹊</li>
<li onclick="showDetails(this)" id="salmon" data-animal-type="鱼类">金枪鱼</li>
<li onclick="showDetails(this)" id="tarantula" data-animal-type="蜘蛛">蝇虎</li>
</ul>
</body>
</html>
dir
定义和用法
dir 属性规定元素内容的文本方向。
值 | 描述 |
---|---|
ltr | 默认从左向右的文本方向 |
rtl | 从右向左的文本方向 |