用CSS隐藏页面元素的5种方法

1.opacity
设置一个元素的透明度只是从视觉上隐藏元素,对页面布局还是有影响,读屏软件会原样读出

2.visibility
设置为hidden将隐藏我们的元素,对网页布局还是起作用,子元素也会被隐藏,单独设置子元素可见是生效的,读屏软件不会读取

3.display
设置为none,相当于元素完全不存在,对页面布局不起作用,子元素也会被隐藏,单独设置子元素可见不生效,读屏软件也不会读取

4.position
假设有一个元素你要与它交互,但又不让它影响网页布局,可以考虑将元素移出可视区域,如.hide{position:absolute;top:-9999px;left:-9999px;}
读屏软件会读取

5.clip-pathd(IE和opera全不支持)
裁剪实现隐藏元素,对页面布局有影响,读屏软件会读取

posted on 2017-06-02 09:23  daV_chen  阅读(213)  评论(0编辑  收藏  举报

导航