有时候 UI 上会出现一些仅供视觉识别的元素，比如说“汉堡包菜单按钮”，只有视力正常的人才能清楚辨识这些元素的作用。而残障人士，比如弱势或盲人是不可能知道这些视觉识别元素是什么的。他们上网使用的是屏幕阅读器，也就是 screen reader（sr），屏幕阅读器需要找到能辨识的文本说明然后“读”出来给用户听。问题是图形元素怎么可能“读出来”呢？因此我们还要写上这些元素的文本说明，但是又不需要展示给普通用户看到，于是加上 sr-only 的意义就在于能保证屏幕阅读器正确读取且不会影响 UI 的视觉呈现。

bootstrap sr-only的更多相关文章

  1. 利用Bootstrap快速搭建个人响应式主页（附演示+源码）

    1.前言 我们每个程序员都渴望搭建自己的技术博客平台与他人进行交流分享,但使用别人的博客模板没有创意.做网站后台的开发人员可能了解前端,可是自己写一个不错的前端还是很费事的.幸好我们有Bootstra ...

  2. Knockout.js, Asp.Net MVC and Bootstrap 前端设计

    原文地址:http://ddmvc4.codeplex.com/ 原文名称:Design and Develop a website using ASP.NET MVC 4, EF, Knockout ...

  3. java +bootstrap table 完整例子

    需求:现在常用的table 插件很多, 比如 jquey datatables ,不过操作挺 麻烦, 看到推荐的bootstrap 自带的 table,就用到项目来,先看效果:

  4. Bootstrap 使用

    bootstrap模板为使IE6.7.8版本(IE9以下版本)浏览器兼容html5新增的标签,引入下面代码文件即可. <script src="https://oss.maxcdn.c ...

  5. ASP.NET MVC+Bootstrap 实现短信验证

    短信验证大家都已经非常熟悉了,基本上每天都在接触手机短信的验证码,比方某宝,某东购物.站点注冊,网上银行等等,都要验证我们的手机号码真实性.这样做有什么优点呢. 曾经咱们在做站点的时候.为了提高用户注 ...

  6. bootstrap class sr-only 什么意思？

    bootstrap class sr-only 什么意思? 在看 bootstrap 内联表单时,label 有一个 class 是 sr-only. sr-only 是给屏幕阅读器用的,是给视力不方 ...

  7. Bootstrap的使用。。。

    概览 深入了解 Bootstrap 底层结构的关键部分,包括我们让 web 开发变得更好.更快.更强壮的最佳实践. HTML5 文档类型 Bootstrap 使用到的某些 HTML 元素和 CSS 属 ...

  8. bootstrap基础学习十篇

    bootstrap字体图标(Glyphicons) a.什么是字体图标 字体图标是在 Web 项目中使用的图标字体.虽然,Glyphicons Halflings 需要商业许可,但是您可以通过基于项目 ...

  9. 旺财速啃H5框架之Bootstrap（五）

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

  10. 旺财速啃H5框架之Bootstrap（四）

    上一篇<<旺财速啃H5框架之Bootstrap(三)>>已经把导航做了,接下来搭建内容框架.... 对于不规整的网页,要做成自适应就有点玩大了.... 例如下面这种版式的页面. ...

随机推荐

  1. 图论（网络流）：SPOJ OPTM - Optimal Marks

    OPTM - Optimal Marks You are given an undirected graph G(V, E). Each vertex has a mark which is an i ...

  2. [Audio processing] 常见语音特征 —— LPC

    共振峰产生的原理及其在音质上的体现,共振峰的分布位置是建立在声音产生媒介的共鸣物理结构基础上的(Resonant Physical Structure).   无论是人声还是乐器,它们的声音特性都源自 ...

  3. 简单约瑟夫环的循环单链表实现(C++)

    刚刚接触C++以及数据结构,今天做了第一次尝试用C++和数据结构解决问题,问题是基于约瑟夫环问题的简单版. 先来看看约瑟夫环问题的介绍: 约瑟夫环是一个数学的应用问题:已知n个人(以编号1,2,3.. ...

  4. 路由器刷机常见第三方固件及管理前端种类(OpenWrt、Tomato、DD-Wrt)

    目前路由器折腾刷机,除了采用各品牌的原厂固件外,第三方路由器固件,基本就是:Tomato.DD-WRT.OpenWRT三种. 基本上所有第三方路由器固件的架构上可分为前端(Frontend)和后端(B ...

  5. Scriptcase演示程序

    为了方便大家对Scriptcase有一个非常直观的印象,现在将Scriptcase的示例程序进行了适当汉化,并且放在互联网上,您可以直接点击这个地址访问. 需要说明的是,示例程序中提供的范例,基本上都 ...

  6. Java中数组的初始化方式

    Java中数组的初始化方式    初始化方式有两种: 1.静态初始化:初始化时由程序猿显式指定每一个数组元素的初始值,由系统指定数组长度 2.动态初始化:初始化时由程序猿仅仅指定数组长度,由系统为数组 ...

  7. STL——静态常量整数成员在class内部直接初始化

    如果class内含const static integral data member,那么根据C++标志规格,我们可以在class之内直接给予初值.所谓integral泛指所有的整数型别(包括浮点数) ...

  8. 八皇后问题 lua版

    简单来讲就是如何在一个8x8的棋盘中放八个棋,让他们两两不能在同一行,同一列,同一斜线. 直接贴代码(出至:programming in lua 3 ) --棋盘大小 SIZE = --判断棋放在ro ...

  9. [转] linux之sed用法

    sed是一个很好的文件处理工具,本身是一个管道命令,主要是以行为单位进行处理,可以将数据行进行替换.删除.新增.选取等特定工作,下面先了解一下sed的用法sed命令行格式为:         sed ...

  10. GDB调试技巧

    1. 查看内存分布 (gdb) info proc mappings 2. 对于类的调试,先通过行号来设断点, 比如:(gdb) b TcpConnection.cc:63 3. 打印数组的内容 (g ...