前端面试题十四
一、如何为有功能限制的浏览器提供网页？
我们知道 js 可以通过 window.navigator.userAgent 来获取浏览器的相关信息。因而通过userAgent来限制访问是个不错的方法。
二、有哪些的隐藏内容的方法（如果同时还要保证屏幕阅读器可用呢？）
1.display:none;的缺陷
搜索引擎可能认为被隐藏的文字属于垃圾信息而被忽略屏幕阅读器（是为视觉上有障碍的人设计的读取屏幕内容的程序）会忽略被隐藏的文字，
同时不利于搜索引擎。
- visibility: hidden ;的缺陷
这个大家应该比较熟悉就是隐藏的内容会占据他所应该占据物理空间
3.overflow:hidden;一个比较合理的方法
.texthidden { display:block;/统一转化为块级元素/ overflow: hidden; width: 0; height: 0; }
就像上面的一段CSS所展示的方法，将宽度和高度设定为0，然后超过部分隐藏，就会弥补上述一、二方法中的缺陷，也达到了隐藏内容的目的。
三、你用过栅格系统 (grid system) 吗？如果使用过，你最喜欢哪种？
Bootstrap中的流式布局；Bootstrap提供了两种布局方式，固定式布局和流式布局（用em表示的叫做弹性布局，用百分比表示的叫做流体布局）方式，Bootstrap的布局实际上是在栅格外加个容器(Container)，因此两种布局方式的唯一区别是：固定布局加的是固定宽度(width)的容器，流式布局加的是自适应(或叫可变)宽度的容器。
四、你用过媒体查询，或针对移动端的布局/CSS 吗？
通过媒体查询可以为不同大小和尺寸的媒体定义不同的css，适合相应的设备显示；即响应式布局
@media screen and (min-width: 400px) and (max-width: 700px) { … }
@media handheld and (min-width: 20em), screen and (min-width: 20em) { … }
作者：Arno_z
链接：https://www.jianshu.com/p/1c314dd0ba1f
來源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
