HTML中的role属性

原创  2016年12月04日 17:16:01
  • 16563

一.什么是role属性

role属性作用是告诉Accessibility类应用(比如屏幕朗读程序,为盲人提供的访问网络的便利程序),这个元素所扮演的角色,主要是供残疾人使用。使用role可以增强文本的可读性和语义化。

在html5元素内,标签本身就是有语义的,因此role是不必添加的,至少是不推荐的,但是bootstrap的案例内很多都是有类似的属性和声明的,目的是为了兼容老版本的浏览器(用户代理),如果你的代码使用了html5标签,并且不准备支持老版本的浏览器,不妨不使用role标签。

二.什么时候使用role?

role的发挥的作用是供有障碍的人士使用,但这并不意味着每个标签都需要增加role属性,因为对于正常的文本本来就可读。role属性的应用主要是表单,比如输入密码,对于正常人可以用placaholder提示输入密码,但是对于残障人士是无效的,这个时候就需要role了。另外,在老版本的浏览器中,由于不支持HTML5标签,所以有必要使用role属性。

HTML role属性相关推荐

  1. 无障碍开发(二)之ARIA role属性

    role属性 role属性值 含义 HTML示意 说明 alert 表示警告 <p id="ajax_error_alert" role="alert"& ...

  2. tabindex,role属性

    组件经常有这样的属性,tabindex,role是个啥嘛? tabIndex属性: 元素的tab键控制次序,会将tabIndex在1-32767之间的控件加入到tab键序列中,点击tab键,会根据值的 ...

  3. html 里面的 role 属性是什么意思

    role="button" role是什么意思? html 里面的 role 属性是什么意义和用途 使用role属性告诉辅助设备(如屏幕阅读器)这个元素所扮演的角色,属于WAI-A ...

  4. HTML中的role属性

    一.什么是role属性 role属性作用是告诉Accessibility类应用(比如屏幕朗读程序,为盲人提供的访问网络的便利程序),这个元素所扮演的角色,主要是供残疾人使用.使用role可以增强文本的 ...

  5. role属性:html中role的作用

    这个role属性之前也没有注意过,下面为转载了解内容 role 是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明. 通常这种情况出现在一些自定义的组件上,这样可增强 ...

  6. Bootstrap学习遇到的role属性--- 无障碍网页应用属性

    以前接触过Bootstrap,但也只是仅仅接触,现在重新学习下,今天看到一个例子中的属性有一个role, 查阅资料发现这个是--WAI-ARIA无障碍设计属性: 通俗说是该设计为了一些盲人,失聪,残疾 ...

  7. bootstrap role属性

    1.用于表示一个普通的标签,使之语义化,方便浏览器对其具体功能进行识别.比如:<div role="button"></div>,也即是将div元素转换为b ...

  8. html标签role属性,data-role属性

    以下是一段代码: 默认地址: 加上css样式过后本应该是如下效果: 可是实际的效果确实这样的: 这是怎么回事呢,html中根本没有写,为什么会出现"保存信息"这四个字呢?后来才知道 ...

  9. aria-required属性学习笔记

    网址:https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-re ...

最新文章

  1. Apache Solr 实现去掉重复的搜索结果
  2. CQ:clearquest
  3. hibernate jpa_JPAHibernate替代方案。 如果JPA或Hibernate对于我的项目而言不够好,该怎么办?...
  4. 高考临考突发情况应急预案大全
  5. 为什么0.1无法被二进制小数精确表示?
  6. 鬲融:从唐山走出的国际杰出青年学者
  7. todolist作业效果
  8. Microsoft Office Communications Server 2007排错日志
  9. Tarjan在图论中的应用(二)——用Tarjan来求割点与割边
  10. 花花省V5淘宝客APP源码无加密社交电商自营商城系统带抖音接口
  11. 屏幕控制实现消息发送以及轰炸
  12. PHP 仍然是最流行的服务器端编程语言
  13. Java程序员笔试面试之String5
  14. RouterPassView – 路由密码查看器
  15. 在html中input是什么意思,在HTML代码中input是什么意思?
  16. 微信公众号开发功能大全
  17. Bose SoundLink Revolve或者Bose SoundLink Revolve+ AUX音频播放一会没有声音
  18. 支持生僻字且自动识别utf-8编码的php汉字转拼音类,支持生僻字且自动识别utf-8编码的php汉字转拼音类_PHP教程...
  19. C语言—猜数字游戏的实现
  20. Python学习笔记:16 面向对象编程入门

热门文章

  1. 感谢给我二次创业的机会
  2. Linux(Centos)之chkconfig命令使用攻略及案例分析
  3. 新能源汽车电子电气架构
  4. 推荐一个免费翻译接口
  5. 博途PLC位变量计数编程(SCL应用)
  6. 写于2015年末的总结
  7. 【笔记】使用Opencv中均值漂移meanShift跟踪移动目标
  8. 用android中的Preferencescreen 启动一个新的 activity
  9. linux wifi名称设置中文乱码,无线wifi名称怎样能设置中文而且不乱码
  10. 据说是比尔盖茨的十句话