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. 960 grid 分析

    960 网格系统的构造如下:页面总宽度 960px12 栏布局, 每栏 60px每栏两边保留 10px 的外边距, 相当于 20px 的槽内容区域总宽度是 940px 960 布局无疑是非常好的网格系 ...

  2. Activitys, Threads, & Memory Leaks

    Activitys, Threads, & Memory Leaks 在Android编程中,一个公认的难题是在Activity的生命周期如何协调长期运行的任务和避免有可能出现的内存泄漏问题. ...

  3. 每天一道题:LeetCode

    本人是研二程旭猿一枚,还有半年多就要找工作了,想想上一年度面试阿里的算法工程师挂了,心有不甘啊,主要还是准备不足,对一些常见的算法问题没有去组织准备,为了明年找一份好的实习,就从现在开始,好好准备吧, ...

  4. iOS 开发常用设置

    1. iOS设置app应用程序文件共享 设置流程 xcode 打开项目----在 info.plist 文件,添加 UIFileSharingEnabled 并设置属性为 YES, 在app内部,将您 ...

  5. Conscription

    Conscription Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 131072/65536K (Java/Other) Total ...

  6. wormhole提升hivereader读取速度方案

    背景: 最近dw用户反馈wormhole传输速度很慢,有些作业甚至需要3-4个小时才能完成,会影响每天线上报表的及时推送.我看了下,基本都是从Hive到其他数据目的地,也就是使用的是hivereade ...

  7. UVALive 3635 Pie 切糕大师 二分

    题意:为每个小伙伴切糕,要求每个小盆友(包括你自己)分得的pie一样大,但是每个人只能分得一份pie,不能拿两份凑一起的. 做法:二分查找切糕的大小,然后看看分出来的个数有没有大于小盆友们的个数,它又 ...

  8. list 去重复

    两层遍历,如果后面的元素和前面的相同,就把后面的删除,达到去重复的目的. 比较的元素可以是list中含有的任意唯一性的元素. for(int x = 0;x < xglist.size()-1; ...

  9. html系列教程--article audio

    <article> 标签 <article> 标签规定独立的自包含内容.一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发. <article> ...

  10. 加密传输SSL协议8_Apache服务器的安装

    学习了那么多的理论的知识,下面通过在Apache服务器中安装和使用SSL协议,实现安全传输,但是首先要安装好Apache服务器. Apache服务器的安装 Linux下所有的软件的原码的安装都是三部曲 ...