aria-label:
正常情况下,form表单的input组件都有对应的label,当input组件获取到焦点时,屏幕阅读器会读出相应label里的文本。
但是如果没有给输入框设置label时,当其获得焦点时,屏幕阅读器会读出aria-label属性的值,aria-label不会在视觉上呈现效果。
 
aria-labelledby:
当想要的标签文本已在其他元素中存在时,可以使用aria-labelledby,并将其值设为所读取的元素的id
 
注:如果一个元素同时又aria-labelledby与aria-label,会优先读出aria-labelledby的内容。

Bootstrap的aria-label与aria-labelledby的更多相关文章

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

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

  2. web语义化之SEO和ARIA

    在快速理解web语义化的时候,只知道web语义化有利于SEO和便于屏幕阅读器阅读,但并不知道它是如何有利于SEO和便于阅读器阅读的,带着这个疑问,进行了一番探索总结. SEO 什么是SEO? SEO( ...

  3. 4.1HTML和Bootstrap css精华

    1.HTML 2.理解Bootstrap HTML元素告诉浏览器,他要表现的是什么类型的内容,当他们不提供任何关于如何显示内容的信息.如何显示内容的信息,由CSS提供. 本书仅包含足够的信息,让你查看 ...

  4. yii\bootstrap

    yii\bootstrap\ButtonDropdown <?php echo yii\bootstrap\ButtonDropdown::widget([ 'label' => 'Act ...

  5. BootStrap下拉框搜索功能

    <!DOCTYPE html> <html> <head> <title>jQuery bootstrap-select可搜索多选下拉列表插件-www. ...

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

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

  7. 无障碍网页设计(WCAG2.0)

    无障碍化是指无论健全人还是残疾人,年轻人还是老年人都可以平等地获取互联网上的信息和服务.无障碍化网站建设不单可以增加网站的受益群体,更是一个有情怀.有担当的互联网企业的责任,也是一个互联网从业人员应该 ...

  8. 使用 HTML5 设计辅助功能

    使用 HTML5 设计辅助功能 Rajesh Lal 下载代码示例 如果您真的对面向广大受众感兴趣,将需要为网站设计辅助功能. 辅助功能使网页更易于访问.更易于使用,可供每个人浏览. 通常,使用最新的 ...

  9. 网络-05-端口号-F5-负载均衡设-linux端口详解大全--TCP注册端口号大全备

    [root@test1:Standby] config # [root@test1:Standby] config # [root@test1:Standby] config # [root@test ...

  10. CentOS 7 服务端口表

    # Note that it is presently the policy of IANA to assign a single well-known# port number for both T ...

随机推荐

  1. SEO高手在扯蛋?

    真正的高手SEO你在扯蛋吗?当大家都很会扯的时候,高手扯得肯定比你疼,不是他们 蛋比较敏感,而是他们的确更用力. 当你说我是SEO时,高手肯定说现在我在做的是SEM. 当你说我是SEM时,高手肯定在说 ...

  2. ByteBuffer用法总结

    转自:http://blog.csdn.net/mars5337/article/details/6576417 在NIO中,数据的读写操作始终是与缓冲区相关联的.读取时信道(SocketChanne ...

  3. find the safest road

    find the safest road Time Limit : 10000/5000ms (Java/Other)   Memory Limit : 32768/32768K (Java/Othe ...

  4. Expect:100-Continue & HTTP 417 Expectation[转]

    Expect:100-Continue & HTTP 417 Expectation 背景:今天调试火车票查询的代码,发现一个奇怪的事情,如果使用公司本地的代理,那么一切正常,如果使用的是公司 ...

  5. Win7 扩容磁盘分区

    1.计算机->管理->磁盘管理,磁盘颜色代表意义 主分区:深蓝色: 扩展分区 :绿色的框: 逻辑分区:浅蓝色的分区: 可用空间:绿色分区 2.非主分区扩容 非主分区扩容十分简单,可是须要注 ...

  6. C#程序之Main()方法

    一.Main()方法的简介 1.一般情况下,一个C#可执行程序只有一个应用程序对象(也就是就程序入口),但是在某些情况,可能会有多个应用程序对象(程序入口),如单元测试中,这个时候我们就需要通过命令行 ...

  7. SQL Server执行计划那些事儿(3)——书签查找

    接下来的文章是记录自己曾经的盲点,同时也透漏了自己的发展历程(可能发展也算不上,只能说是瞎混).当然,一些盲点也在工作和探究过程中慢慢有些眉目,现在也愿意发扬博客园的奉献精神,拿出来和大家分享一下. ...

  8. Invalid signature file digest for Manifest main attributes

    Solving a Spark error: Invalid signature file digest for Manifest main attributes When using spark-s ...

  9. Arduino周边模块:LCD与数码管

    Arduino周边模块:LCD与数码管 Arduino周边模块:LCD与数码管 数码管的介绍 数码管一般是用来显示数字和字符的 数码管原理 一位数码管 该图是一个8段数码管,该数码管中包含了8个LED ...

  10. java反射获取注解并拼接sql语句

    先建两个注解 分别为 Table 和 Column package com.hk.test; import java.lang.annotation.ElementType; import java. ...