元素中的 aria-label用来命名一个元素

 
 
它的值可以是任何字符
 
读屏软件就会读出aria-label里的内容
<div role=”form” aria-labelledby=”form-title”>
<span id=” form-title”>使用手机号码注册</span>
<form>……</form>
</div>
如果一个元素同时有aria-labelledby和aria-label,读屏软件会优先读出aria-labelledby的内容。
role的作用是描述一个非标准的tag的实际作用。比如用div做button,那么设置div 的 role=“button”,辅助工具就可以认出这实际上是个button。

aria-label的更多相关文章

  1. 智能选择器和语义化的CSS

    本文由白牙根据Heydon Pickering的<Semantic CSS With Intelligent Selectors>所译,整个译文带有我自己的理解与思想,如果译得不好或不对之 ...

  2. [HTML 5] aria-hidden

    You want to use aria-hidden to prevent screen reader to access some content should be hidden from us ...

  3. 一些DevTools的小技巧-让你不止会console.log()

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文参考:https://www.sitepoint.com/beyond-console-log-leve ...

  4. ARIA无障碍技术

    ARIA Accessible Rich Internet Applications (ARIA) 规定了能够让 Web 内容和 Web 应用(特别是那些由 Ajax 和 JavaScript 开发的 ...

  5. [翻译]如何在HTML5中有效使用ARIA

    ARIA是Accessible Rich Internet Application的简称,指无障碍富互联网应用.可以使一些有功能障碍(如听力,视力)的人群,使用你的网站.下面看一下做为开发人员的我们, ...

  6. [HTML5] Why ARIA?

    For some reason, you build a custom checkbox component, if without ARIA in mind, basiclly this site ...

  7. 无障碍开发(六)之ARIA在HTML中的使用规则

    ARIA使用规则一 如果你使用的元素( HTML5 )具有语义化,应该使用这些元素,而不应该重新定义一个添加ARIA的角色.状态或属性的元素. 浏览器的语义化标签已经默认隐含ARIA语义,像nav,a ...

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

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

  9. ios label 自动计算行高详解

    在OC当中自动计算行高主要调用系统的 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #ffffff } span ...

  10. Android studio使用gradle动态构建APP(不同的包,不同的icon、label)

    最近有个需求,需要做两个功能相似的APP,大部分代码是一样的,只是界面不一样,以前要维护两套代码,比较麻烦,最近在网上找资料,发现可以用gradle使用同一套代码构建两个APP.下面介绍使用方法: 首 ...

随机推荐

  1. 第一个ExtJS练习(添加用户面板)

    1.[准备] 我是在visual studio里面建立了一个asp.net MVC项目,然后导入ExtJS必要的包,然后写的. ExtJS5.1版本下载:https://pan.baidu.com/s ...

  2. 【JVM命令系列】jstat

    命令基本概述 Jstat是JDK自带的一个轻量级小工具.全称"Java Virtual Machine statistics monitoring tool",它位于java的bi ...

  3. 基于MyBatis3.0.6的基本操作介绍

    每 一 个 MyBatis 的 应 用 程 序 都 以 一 个 SqlSessionFactory 对 象 的 实 例 为 核 心 .SqlSessionFactory本身是由SqlSessionFa ...

  4. Day2 python基础学习

    http://www.pythondoc.com/ Python中文学习大本营 本节内容: 一.字符串操作 二.列表操作 三.元组操作 四.字典操作 五.集合操作 六.字符编码操作 一.字符串操作 1 ...

  5. Ansible(三) - playbook简介

    Ⅰ. Playbook介绍 Playbook其实就是ansible的一个任务列表,各任务按次序逐个在hosts中指定的所有主机上执行,即在所有主机上完成第一个任务后再开始第二个.在顺序运行某playb ...

  6. jP61 2.15

    import java.util.Scanner; public class Distance { public static void main(String[] args) {    Scanne ...

  7. IDE快捷键

    visual studio 中 : /// 快速函数注释 ctrl+k,ctrl+F 格式化代码 Android Studio  中: /**回车 快速函数注释 ctrl+h 查看继承关系 自动格式化 ...

  8. JavaScript 版数据结构与算法(二)队列

    今天,我们要讲的是数据结构与算法中的队列. 队列简介 队列是什么?队列是一种先进先出(FIFO)的数据结构.队列有什么用呢?队列通常用来描述算法或生活中的一些先进先出的场景,比如: 在图的广度优先遍历 ...

  9. Python使用Scrapy爬虫框架全站爬取图片并保存本地(妹子图)

    大家可以在Github上clone全部源码. Github:https://github.com/williamzxl/Scrapy_CrawlMeiziTu Scrapy官方文档:http://sc ...

  10. C-Flex 与 box布局教程

    http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html -阮一峰老师 http://www.w3cplus.com/css3/flexbox- ...