您的位置:首页 > Web前端 > CSS

div+css隐藏内容方法

2011-12-14 15:41 309 查看

div css隐藏内容样式方法

一般情况下,css隐藏的用途

1、对文本的隐藏

2、隐藏超链接(另类黑链)

3、对统计代码隐藏

4、隐藏超出图片

5、css隐藏滚动条

6、css来隐藏div

使用css隐藏方法

1、使用display:none;来隐藏所有信息(无空白位占据)推荐,CSS
display手册查看

2、使用overflow:hidden;来隐藏溢出的文字或图片 适用推荐,css
overflow手册查看

3、使用overflow-y:hidden;和overflow-x:hidden控制滚动条的隐藏与否,css
overflow-y手册查看,css手册查看overflow-x

常见div css隐藏案例

1、对display:none;文本图片的隐藏如

<div style="display:none;">你是看不见我的</div>

使用divcss样式display:none;将使得div内的内容隐藏通过浏览器什么也看不见,并且隐藏的内容也不会占用空间。通过此方法可以隐藏超链接文本(黑链)和图片等内容同时也会隐藏div层样式。推荐使用隐藏内容。

2、overflow: hidden 隐藏内容或图片

实例如:

我是可以看见的<br/><br/>

<div style="overflow: hidden; width:30px; height:20px;">你是看不见我的。</div>

<br/>

同样我也是可以看见的



使用css样式通过对“你是看不见我的”div css层设置固定的高和宽,然后通过overflow: hidden样式即可使得超出固定的高宽内容隐藏同时也不占用被隐藏地方位置。

3、使用overflow-y:hidden;和overflow-x:hidden来隐藏或显示对应横或竖方向的滚动条。此案例可以进入css手册的overflow-y和css在线手册的overflow-x有详细的讲解对滚动条的设置隐藏或显示方法。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: