HTML 属性

属性：
【class】
规定元素的一个或多个类
注意: 类不能以数字开头

class = "classA classB" // 多个类的写法

【id】
规定元素的唯一标识
注意：若浏览器中出现多个id名的情况，CSS样式对所以该id名的元素都生效，但javascript脚本仅对第一个出现该id名的元素生效

【dir】
文字的方向
值：ltr/rtl/auto

【lang】
HTML的lang属性可用于标记网页或部分网页的语言。也就是说lang这个属性不仅仅可以用在html标签上

en:英文
zh:中文
zh-CN：简体中文

<html lang="en">

<p>You'd say that in Chinese as <span lang="zh">文献情报中心</span>.</p>

有什么作用？
简单来说，可能对于程序来说没有太大的作用，但是它可以告诉浏览器，搜索引擎，一些处理Html的程序对页面语言内容来做一些对应的处理或者事情。
比如可以
根据根据lang属性来设定不同语言的css样式，或者字体

  • 告诉搜索引擎做精确的识别
  • 让语法检查程序做语言识别
  • 帮助翻译工具做识别
  • 帮助网页阅读程序做识别
    等...

【style】
设置行间样式

<div style="background:red;"></div>

【tabindex】
规定元素的tab键次序（1开始）

<div>
    <a tabindex="3">cc</a>
    <a tabindex="2">bb</a>
    <a tabindex="1">aa</a>
</div>

【title】
规定关于元素的额外信息，鼠标移到元素上时显示一段提示文本

<a href="#" title="我是一个超链接">百度</a>

HTML5新增的属性

【contenteditable】
作用：指定是否可以在浏览器里编辑内容
值：true/false
注意：设置document.designMode ='on'时，页面的任意位置都可以编辑；使用contenteditable ='true'则只对具体元素和其包含的元素起作用
移动端：移动端ios5以及android3之后才支持该属性

【data-*】
作用：用于存储页面或应用程序的私有定制数据
注意：属性名不应包含任何大写字母，且在前缀"data-"之后必须有至少一个字符；属性值可以是任意字符串
使用：可以在所有浏览器中使用getAttribute方法来获取data-属性的值，也可以使用javascript中dataset属性访问data-属性的值，不过IE10-浏览器不支持dataset

【draggable】IE8- 不支持
作用：用户是否可以拖动元素
值：true/false/auto
注意：链接和图像默认是可拖动的

【hidden】(IE7-不支持)
作用：显示或隐藏该元素(与display:none的作用一样)
值：hidden="" || hidden= "hidden"

【spellcheck】(IE9-不支持)
作用：规定是否对元素进行拼写和语法检查,对拼写错误的单词会在其下方出现红线
范围：可编辑区域（表单或contenteditable元素）
值：true/false
注意：移动端支持不好

HTML（三）HTML属性的更多相关文章

  1. CSS3制作动画的三个属性

    CSS3属性中有关于制作动画的三个属性:Transform,Transition,Animation:我们一起学习完了Transform和Transition,让我们对元素实现了一些基本的动画效果,这 ...

  2. Delphi2010中DataSnap高级技术(7)—TDSServerClass中Lifecycle生命周期三种属性说明

    Lifecycle 三种属性: Session.Invocation.Server 这三种属性都用在什么情况,有什么要注意的事项,Delphi2010中罕有说明. 如果乱用这三种属性,你的服务程序有可 ...

  3. 深入理解javascript函数系列第三篇——属性和方法

    × 目录 [1]属性 [2]方法 前面的话 函数是javascript中的特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本 ...

  4. Quartz定时任务学习（二)web应用/Quartz定时任务学习（三）属性文件和jar

    web中使用Quartz 1.首先在web.xml文件中加入 如下内容(根据自己情况设定) 在web.xml中添加QuartzInitializerServlet,Quartz为能够在web应用中使用 ...

  5. Struts表单格局;theme三个属性值：simple,xhtml,css_xhtml

    转自:http://www.educity.cn/wenda/7156.html 解决Struts2 Form表单自己布局之前先看看 theme 属性, theme属性提供 三个属性值:simple, ...

  6. Java NIO（New I/O）的三个属性position、limit、capacity

    Java NIO(New I/O)的三个属性position.limit.capacity 在缓冲区中,最重要的属性有下面三个,它们一起合作完成对缓冲区内部状态的变化跟踪: capacity posi ...

  7. Android开发之隐式Intent中Intent-filter的三个属性-action,category,data

    使用隐式Intent时,需要使用到意图过滤器Intent-filter.Intent-filter含有三个属性:action,category,data.通过这三个属性的组合,可以启动想要启动的act ...

  8. Spark学习笔记-三种属性配置详细说明【转】

    相关资料:Spark属性配置  http://www.cnblogs.com/chengxin1982/p/4023111.html 本文出处:转载自过往记忆(http://www.iteblog.c ...

  9. input的三个属性autocomplete、autocapitalize和autocorrect

    下面的input的三个属性是H5新增的属性 <input type="text" class="input-search" placeholder=&qu ...

  10. Android View体系（三）属性动画

    上一篇文章讲了View滑动的六种方法,其中一种是使用动画,这篇文章我们来讲一讲动画的其中一种:属性动画. 1.android视图动画和属性动画 视图动画我们都了解,它提供了AlphaAnimation ...

随机推荐

  1. SQLServer之创建唯一非聚集索引

    创建唯一非聚集索引典型实现 唯一索引可通过以下方式实现: PRIMARY KEY 或 UNIQUE 约束 在创建 PRIMARY KEY 约束时,如果不存在该表的聚集索引且未指定唯一非聚集索引,则将自 ...

  2. LeetCode算法题-Heaters（Java实现）

    这是悦乐书的第239次更新,第252篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第106题(顺位题号是475).冬天来了!您在比赛期间的第一份工作是设计一个固定温暖半径 ...

  3. 我的第一个python web开发框架（33）——接口代码重构

    前面ORM模块我们已经完成了开发,接下来要做的就是对项目代码进行重构了.因为对底层数据库操作模块(db_helper.py)进行了改造,之前项目的接口代码全都跑不起来了. 在写ORM模块时,我们已经对 ...

  4. 先vue-cli,再nuxt试试路由

    https://segmentfault.com/a/1190000007933349

  5. pybind11 安装

    Prerequisites: $ sudo apt-get install python-dev  (or python3-dev) $ sudo apt-get install cmake $ su ...

  6. pyinstaller 打包selenium脚本 取消cmd

    更改源代码 找到文件(selenium->webdriver->common->service.py) 添加一个参数

  7. ###20175311MyCP（课下作业，必做）

    MyCP(课下作业,必做) 作业题目 编写MyCP.java 实现类似Linux下cp XXX1 XXX2的功能,要求MyCP支持两个参数: java MyCP -tx XXX1.txt XXX2.b ...

  8. 【P2015】二叉苹果树 (树形DP分组背包)

    题目描述 有一棵苹果树,如果树枝有分叉,一定是分2叉(就是说没有只有1个儿子的结点) 这棵树共有N个结点(叶子点或者树枝分叉点),编号为1-N,树根编号一定是1. 现在这颗树枝条太多了,需要剪枝.但是 ...

  9. go笔记-值传递、引用传递

    eg: func sliceModify(slice []int) { // slice[0] = 88 slice = append(slice, ) } func main() { slice : ...

  10. 如何用ABP框架快速完成项目(6) - 用ABP一个人快速完成项目(2) - 使用多个成熟控件框架

    正如我在<office365的开发者训练营,免费,在微软广州举办>课程里面所讲的, 站在巨人的肩膀上的其中一项就是, 尽量使用别人成熟的框架. 其中也包括了控件框架   abp和52abp ...