2011-11-22 142 views
2

我已阅读(实际上在SO上,但目前无法找到该帖子)关于隐藏具有负边距元素的方法。具有负边距的隐藏元素

我记得,答案包含了为什么要这样做的深刻解释,以及与其他方法(visibility: hidden; position: absolute;,display: none)相比的好处。是的,该方法提供了一种从文档流中移除元素的方法(可能是黑客,无效)。

我一直在梦想着这个还是有这样一种方式?如果有,那么是的,我会喜欢这个小小的深入解释。

在此先感谢!

+0

据我所知,从文档流中除去某些东西的唯一方法是使用'position:absolute'。您肯定可以隐藏具有负边距的元素,但它仍会处于流程中。 – motoxer4533

+0

它来自这里吗? http://stackoverflow.com/questions/4989930/css-negative-margin –

+0

@Diodeus,在问之前检查它,没有任何关于隐藏。 – jolt

回答

4

您是试图隐藏像div这样的块级元素,或者仅仅是获得背景图像的链接上的文本。如果它是第二个项目,您要查找的CSS是文本缩进。我用它在过去是这样的:

a.button { 
    /* .button is a for instance class name */ 
    text-indent: -9999px 
} 

这将使块级元素(标签),并且已将其上的任何背景,在公文流转,但将移动文本关闭屏幕。这是我过去使用的技术,但要小心你隐藏的文本 - 搜索引擎将其视为准黑帽技术。只要确保隐藏文字看起来不像关键字填充或明显的垃圾邮件条款,你会没事的。

希望这会有所帮助。

+0

哦,快点!这可能是这个而不是保证金。 *接受这一点,因为它是“最接近”的答案* – jolt

2

使用负页边空白通常被认为是一种更“容易”隐藏元素的方式。绝对定位或浮动将其从文档流中移除。

本文总结了几种图像替换技术。

http://www.mezzoblue.com/tests/revised-image-replacement/

HTH!

+0

“一般认为” - 由谁?无障碍意味着内容对每个人都是可访问的,而不是多余的内容可供残障用户使用,而不是其他人。使用屏幕阅读器,看看这种方式分崩离析。 – PointedEars

+1

@PointedEars由网页设计思想领袖和可访问性专家用屏幕阅读器测试了各种图像替换技术。阅读我分享的文章。 – RaeLehman

+0

您已经分享了文章,但是您还没有阅读文章。如果你有的话,你会发现这些货运文化方法都存在问题。至于“网页设计思想领袖和无障碍专家”,你一定是在开玩笑。 – PointedEars

2

要么你一直在做梦,要么你已经成为货物崇拜编码的受害者。过度负边限的明显缺点是您依赖最大窗口大小。 (过多的负面text-indent也有这个问题和其他。)任何更大的和元素变得可见。除此之外,它并没有指定如何处理这种幅度的负边界。

只有display: none您可以可靠地删除元素(就好像它不在那里)。绝对定位将正常流程中的某个元素取出,这与移除它不同。