1、什么是HTML属性
- HTML 元素可以设置属性
- 属性可以在元素中添加附加信息
- 属性一般描述于开始标签
- 属性总是以名称/值对的形式出现，比如：name="value"。
2、属性实例
- <a href="http://baidu.com" target="_blank"></a>
- <input type="text" name="username"></input>
- <div style="width:100px;height:100px;background-color:red;" title="一个红色的盒子"></div>
- <div id="box" class="box"></div>
- 其它：还有很多标签有各自的属性，后面会一一讲解。
3、HTML 属性书写规则
- 属性值应该始终被包括在引号内。
- 双引号是最常用的，不过使用单引号也没有问题。
- 在某些个别的情况下，比如属性值本身就含有双引号，那么您必须使用单引号，例如：name='John "ShotGun" Nelson'
例如：<div title='my name is "John ShotGun" Nelson'></div>
- 属性和属性值对大小写不敏感。
4、HTML 属性参考手册
| accesskey | 设置访问元素的键盘快捷键，如： <a href="http://baidu.com" accesskey="h">HTML 教程</a> |
| class | 规定元素的类名（classname）如：<h1 class="intro">标题 1</h1>。 可通过样式表中的.intro选中该标签。 |
| contenteditable | 规定是否可编辑元素的内容。<p contenteditable="true">这是一个可编辑段落。</p> 让非input、textarea元素变得可输入。 |
| contextmenu | 指定一个元素的上下文菜单。当用户右击该元素，出现上下文菜单 <div contextmenu="mymenu"> |
| data-* | 用于存储页面的自定义数据，如：<li data-animal-type="bird">Owl</li> 可以在点击该元素时在点击事件中获取该元素的属性值：event.target.dataset.animalType |
| dir | 设置元素中内容的文本方向。<bdo dir="rtl">文本方向从右到左!</bdo> |
| draggable | 指定某个元素是否可以拖动：需要跟js配合使用，可制作类似于酷狗音乐的长按排序。 |
| dropzone | 指定是否将数据复制，移动，或链接，或删除。<div dropzone="copy"></div> |
| hidden | hidden 属性规定对元素进行隐藏。<p hidden>这是一段隐藏的段落。</p> |
| id | 规定元素的唯一 id：在样式表中通过#id去获取元素，给获取的元素设定样式。 |
| lang | 设置元素中内容的语言代码。<p lang="fr">这是一个段落。</p> |
| spellcheck | 检测元素是否拼写错误。<p contenteditable="true" spellcheck="true">这是可编辑的段落。请试着编辑文本。</p> |
| style | 规定元素的行内样式（inline style）<p style="color:green">这是绿色文字的段落。</p> |
| tabindex | 设置元素的 Tab 键控制次序。<a href="//www.google.com/" tabindex="1">Google</a><br /> |
| title | 规定元素的额外信息（可在工具提示中显示） |
| translate | 指定是否一个元素的值在页面载入时是否需要翻译，所有浏览器目前不支持该属性 |
关注我的公众号，每天会持续不断更新编程干货。
