<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>菜鸟教程(runoob.com)</title>

        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

        <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    </head>

    <body>

        <div class="container">

            <h2>实例</h2>

            <p> .sr-only 类除了屏幕阅读器外，其他设备上都隐藏元素:</p>

            <a class="sr-only" href="#">跳转到主要内容</a>

            <p>与 .sr-only 类结合使用，在元素获取焦点时显示(如：键盘操作的用户):</p>

            <a class="sr-only sr-only-focusable" href="#">跳转到主要内容</a>

        </div>

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：除了屏幕阅读器外，其他设备上隐藏元素的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：在元素获取焦点时显示(如：键盘操作的用户)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：屏幕阅读器

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：元素浮动到右边

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：响应式实用工具

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 显示代码：电脑程序输出: Sample output

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 显示代码：多行代码带有滚动条

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 显示代码：按键提示

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 显示代码：变量赋值

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 显示代码

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. 数码管显示“0~F”的共阳共阴数码管编码表

    嵌入式设备中数码管显示“0~F”的方式是:定义了一个数组,里面含有16个元素,分别代表0~F,这样可以方便以后的调用.共阳极数码管编码表:unsigned char table[]={0xc0,0xf ...

  2. ASP.NET Core搭建多层网站架构【15-扩展之使用Obfuscar混淆加密保护代码】

    2020/02/03, ASP.NET Core 3.1, VS2019, Obfuscar 2.2.25 摘要:基于ASP.NET Core 3.1 WebApi搭建后端多层网站架构[15-扩展之使 ...

  3. 关于报错:Warning: Cannot modify header information - headers already sent by (output started at

    8月5日,第一个项目即将完成,测试时,发现登录功能会出现小问题:记住密码的时候会报错 Warning: Cannot modify header information - headers alrea ...

  4. Js 类继承 extends

    html 及 js 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  5. Vue父组件主动获取子组件的数据和方法

    Vue父组件主动获取子组件的数据和方法 https://www.jianshu.com/p/bf88fc809131

  6. 安装 Python 虚拟环境 (Linux)

    我的 Ubuntu 18.04 预安装了 python 3.6,但是没有安装 pip,所以先进行安装: apt-get install python-pip 1. 安装虚拟环境所需包: pip ins ...

  7. Js判断值是否是NaN

    方法一:window.isNaN() 注意: window.isNaN 只对数值有效,如果传入其他值,会被先转成数值.比如,传入字符串的时候,字符串会被先转成NaN,所以最后返回true,这一点要特别 ...

  8. IDEA 查看某个class的maven引用依赖&如何展示Diagram Elements

    1.打开对应的class,如下图所示,至于具体快捷键就不说了,我是设置的eclipse的快捷键: 2.定位到对应jar,记下jar名称及版本: 3.在右侧栏点击maven,再在展出的视图中找到对应的m ...

  9. masonry使用添加紧凑、抗压属性

    // 内容紧凑 - 优先完全显示内容,且不多占像素. [self.leftLabel setContentHuggingPriority:UILayoutPriorityDefaultHigh for ...

  10. flask exception

    flask exception 1.1.    abort 概念:flask中的异常处理语句,功能类似于python中raise语句,只要触发abort,后面的代码不会执行,abort只能抛出符合ht ...