java面试题网

普通会员

183

帖子

7

回复

85

积分

楼主
发表于 2019-07-09 21:08:37 | 查看: 5040| 回复: 0

CSS有哪些的隐藏内容的方法(如果同时还要保证屏幕阅读器可用呢?)

CSS有哪些的隐藏内容的方法(如果同时还要保证屏幕阅读器可用呢?)
需要隐藏内容的几种可能性:
1)对文本的隐藏
2)隐藏超链接(另类黑链)
3)对统计代码隐藏
4)隐藏超出图片
5)css隐藏滚动条
6)css隐藏div层
具体实现:
1、css隐藏DIV及内容,完全隐藏内容与布局。display:none或者visibility:hidden
面试官也许会问到:关于display:none和visible:hidden区别
display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:
display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。
visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到。
2、通过对象盒子设置缩进样式(text-indent:-9999px)方法可以隐藏超链接文本内容
同样道理,可以用来隐藏图片上方文字。此类问题我们常见于LOGO处使用,我们想让图片作为背景,而图片上方放A链接文字内容,但html锚文本功能仍然正常也能鼠标点击使用。图片作为背景而html代码内看不到图片,但文字也存在,却是文字隐藏图片显示出,鼠标也能点击指向。
3、overflow: hidden 隐藏溢出DIV内容或图片
4、css隐藏滚动条
使用overflow-y:hidden;和overflow-x:hidden来隐藏或显示对应横或竖方向的滚动条。


文章来自www.wityx.com,转载请注明出处!原文地址http://www.wityx.com/post/851_1_1.html

您需要登录后才可以回帖 登录 | 立即注册

java面试题网www.wuliaokankan.cnjava建站系统提供技术支持V2.1 网站地图 © 2016-2018