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. CentOS 7 安装 Gitlab

    https://segmentfault.com/a/1190000002729796

  2. Xshell中文乱码

    终端”编码设置,默认是 默认语言,选择UTF8设置即可

  3. Ubuntu 12.04下安装ibus中文输入法

    这是最完整的安装方法: ibu是一个框架,可以支持多种输入法,像是pinyin,五笔等. 1,安装ibus框架 终端输入以下命令: sudo apt-get install ibus ibus-clu ...

  4. Python学习笔记3-文件的简单操作

    Python中的文件操作 Python中文件打操作离不开两个模块  os 和 shutil os:操作文件.目录: Python os模块包含普遍的操作系统功能.如果你希望你的程序能够与平台无关的话, ...

  5. Linux学习之二十、循环

    原文地址:http://vbird.dic.ksu.edu.tw/linux_basic/0340bashshell-scripts_5.php 回圈 (loop) 除了 if...then...fi ...

  6. Colorbox cannot load the image added by js

    As we know, Colorbox is a wonderful js plugin. I came up against a head-banged problem in v1.5.6. Wh ...

  7. TCPDUMP详解(续)

    TCPdump抓包命令  tcpdump是一个用于截取网络分组,并输出分组内容的工具.tcpdump凭借强大的功能和灵活的截取策略,使其成为类UNIX系统下用于网络分析和问题排查的首选工具.  tcp ...

  8. VS2010在C盘下生成的.iTrace文件解决办法 ,c盘偷偷的减少,心很烦啊,找了半天才知道是这个问题

    用Visual Studio 2010后发现我的c盘变得越来越小了,刚开始通过优化工具清理c盘,但是无论怎么做都不能将c的内存有效提升,之后一个一个目录的查找之后才知道有个文件夹C:\ProgramD ...

  9. bootstarp栅格系统

    ##### 1.3.2 栅格系统 - Bootstrap中定义了一套响应式的网格系统,- 其使用方式就是将一个容器划分成12列,- 然后通过col-xx-xx的类名控制每一列的占比 ##### 1.3 ...

  10. typedef的用法总结

    typedef的用法总结 不管实在C还是C++代码中,typedef这个词都不少见,当然出现频率较高的还是在C代码中.typedef与#define有些相似,但更多的是不同,特别是在一些复杂的用法上, ...