2.全局属性

HTML 全局属性

• accesskey

  • accesskey 属性规定**（使元素获得焦点）元素的快捷键。
  • 注意： 在不同操作系统中不同的浏览器中访问快捷键的方式不同：
    
  • 提示： 各种浏览器下accesskey快捷键的使用方法：
    • IE浏览器
      • 按住Alt键，点击accesskey定义的快捷键(焦点将移动到链接)，再按回车.
    • FireFox浏览器
      • 按住Alt+Shift键，点击accesskey定义的快捷键.
    • Chrome浏览器
      • 按住Alt键，点击accesskey定义的快捷键.
    • Opera浏览器
      • 按住Shift键，点击esc，出现本页定义的accesskey快捷键列表可供选择.
    • Safari浏览器
      • 按住Alt键，点击accesskey定义的快捷键.
  • 语法：<element accesskey="character">
  • 属性值：
    • character：指定**元素的快捷键

• class

  • class 属性定义了元素的类名。
  • class 属性通常用于指向样式表的类。但是，它也可以用于 JavaScript 中（通过 HTML DOM）, 来修改 HTML 元素的类名。
  • 语法：<element class="classname">
  • 属性值：
    • classname：规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。 <span class="left important">. HTML 元素允许使用多个类。
      • 名称规则：
        • 必须以字母 A-Z 或 a-z 开头
        • 可以是以下字符： (A-Za-z), 数字 (0-9), 横杆 ("-"), 和 下划线 ("_")
        • 在 HTML 中, 类名是区分大小写的

• contenteditable

  • contenteditable 属性指定元素内容是否可编辑。
  • 注意： 当元素中没有设置 contenteditable 属性时，元素将从父元素继承。
  • 语法：<element contenteditable="true|false">
  • 属性值：
    • true：指定元素是可编辑的
    • false：指定元素是不可编辑的

• contextmenu

  • contextmenu 属性规定了元素的上下文菜单。当用户右击元素时将显示上下文菜单
  • contextmenu 属性的值是需要打开的 <menu> 元素的 id。
  • 语法：<element contextmenu="menu_id">
  • 属性值：
    • menu_id：要打开的 <menu> 元素的 id。

• data-*

  • data-* 属性用于存储私有页面后应用的自定义数据。
  • data-* 属性可以在所有的 HTML 元素中嵌入数据。
  • 自定义的数据可以让页面拥有更好的交互体验（不需要使用 Ajax 或去服务端查询数据）。
  • data-* 属性由以下两部分组成：
    • 属性名不要包含大写字母，在 data- 后必须至少有一个字符。
    • 该属性可以是任何字符串
  • 注意： 自定义属性前缀 “data-” 会被客户端忽略。
  • 语法：<element data-*="somevalue">
  • 属性值：
    • somevalue：指定属性值 (一个字符串)

• dir

  • dir 属性规定元素内容的文本方向。
  • 语法：<element dir="ltr|rtl|auto">
  • 属性值：
    • ltr：默认。从左向右的文本方向。
    • rtl：从右向左的文本方向。
    • auto：让浏览器根据内容来判断文本方向。仅在文本方向未知时推荐使用。

• draggable

  • draggable 属性规定元素是否可拖动。
  • 提示： 链接和图像默认是可拖动的。
  • 提示： draggable 属性经常用于拖放操作。
  • 语法：<element draggable="true|false|auto">
  • 属性值：
    • true：规定元素是可拖动的。
    • false：规定元素是不可拖动的。
    • auto：使用浏览器的默认特性

• dropzone

  • dropzone 属性规定当被拖动的数据在拖放到元素上时，是否被复制、移动或链接。
  • 语法:<element dropzone="copy|move|link">
  • 属性值:
    • copy: 拖动数据会导致被拖数据产生副本。
    • move：拖动数据会导致被拖数据移动到新位置。
    • link：拖动数据会生成指向原始数据的链接。

• hidden

  • hidden 属性规定对元素进行隐藏。
  • 隐藏的元素不会被显示。
  • 如果使用该属性，则会隐藏元素。
  • 可以对 hidden 属性进行设置，使用户在满足某些条件时才能看到某个元素（比如选中复选框，等等）。然后，可使用 JavaScript 来删除 hidden 属性，使该元素变得可见。
  • 语法：<element hidden>

• id

  • id 属性规定 HTML 元素的唯一的 id。
  • id 在 HTML 文档中必须是唯一的。
  • id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
  • 语法：<element id="id">
  • 属性值：
    • id：规定元素的唯一 id。
      • 命名规则：
        • 必须以字母 A-Z 或 a-z 开头
        • 其后的字符：字母(A-Za-z)、数字(0-9)、连字符("-")、下划线("_")、冒号("???? 以及点号(".")
        • 值对大小写敏感

• lang

  • lang 属性规定元素内容的语言。
  • 语法:<element lang="language_code">
  • 属性值:
    • language_code:规定元素内容的语言代码。语言代码参考手册(https://www.runoob.com/tags/html-language-codes.html)

• spellcheck

  • spellcheck 属性规定是否对元素内容进行拼写检查。
  • 可对以下文本进行拼写检查：
    • 类型为 text 的 input 元素中的值（非密码）
    • textarea 元素中的值
    • 可编辑元素中的值
  • 语法：<element spellcheck="true|false">
  • 属性值：
    • true：规定应当对元素的文本进行拼写检查。
    • false：规定不应对元素的文本进行拼写检查。

• style

  • style 属性规定元素的行内样式（inline style）。
  • style 属性将覆盖任何全局的样式设定，例如在 <style> 标签或在外部样式表中规定的样式。
  • 语法：<element style="style_definitions">
  • 属性值
    • style_definitions：一个或多个由分号分隔的 CSS 属性和值。 (例如： style=“color:blue;text-align:center”)

• tabindex

  • tabindex 属性规定当使用 “tab” 键进行导航时元素的顺序。
  • 语法：<element tabindex="number">
  • 属性值：
    • number：规定元素的 tab 键控制顺序（1 是第一）

• title

  • title 属性规定关于元素的额外信息。
  • 这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）
  • 语法：<element title="text">
  • 属性值：
    • text：规定元素的工具提示文本（tooltip text）。

• translate

  • translate 属性规定元素内容是否要翻译。
  • 语法：<element translate="yes|no">
  • 属性值：
    • yes：规定元素内容需要翻译
    • no：规定元素内容不需要翻译