14

我试图<li>通过设置使用 CSS 隐藏元素内的一些文本text-indent: -999px;。由于某种原因，当我将文档的方向设置为（从右到左 - 我的网站是希伯来语）
时，这不起作用。 当方向是“rtl”时，文本仍然显示...... 任何人都知道为什么，以及解决这个问题的方法吗？"rtl"

4

11 回答 11

19

随着text-indent: -9999px尝试使用display: block;. 它为我解决了。

此外，如果您需要 li 元素水平浮动（例如水平菜单），请使用float: left;.

于 2011-10-31T19:21:59.290 回答
12

设置direction:ltr你试图给出的元素怎么text-indent办？

演示： jsfiddle.net/Marcel/aJBnN/1/

于 2011-03-19T05:09:37.903 回答
4

我的问题是文本对齐。如果您修改元素的对齐模式或将其包裹到左侧的父元素，则必须为文本缩进提供负索引。否则你必须给出一个正值。

.case1{text-indent:-999px;text-align:left;overflow:hidden;display:block}

否则

.case2{text-indent:999px;text-align:right;overflow:hidden;display:block}
于 2015-04-22T19:21:18.467 回答
2 
color: transparent;

或者

font-size:0px;
于 2014-04-15T19:03:10.980 回答
2

尝试设置 text-alignment 以匹配您缩进文本的方向。

例如，如果您使用 LTR 并希望对文本进行负缩进，除了添加 display: 块之外，您还应该添加左对齐。

不确定 RTL，但似乎合乎逻辑，您应该积极缩进并使用右对齐。

于 2012-02-09T21:13:11.450 回答
2

我发现最好的方法是使文本成为透明颜色：

颜色：rgba(0,0,0,0);

注意：这个 bug 在 firefox 12 中仍然存在（文本缩进值在 rtl 上被忽略）

于 2012-05-17T10:16:03.367 回答
1

我更喜欢这个解决方案：

.hide_text { text-indent: 100%; white-space: nowrap; overflow: hidden; }
于 2015-04-21T07:20:24.143 回答
1

您可以使用 line-height 指定一个较大的值，例如 100px 用于 30px 高的容器。

仅当您的容器尺寸有限时才有效。如果还没有，您可能必须专门设置高度。

于 2011-03-19T04:55:20.047 回答
0

文本对齐：右；为我工作

于 2013-08-13T05:53:12.017 回答
0

这text-indent: -99px是一个古老的技巧，它不是隐藏文本的最佳方式。为什么不visibility:hidden改用？

于 2010-05-15T23:15:24.747 回答
0

添加隐藏溢出然后它会正常工作。

div{
    text-indent: 100%;
    overflow: hidden;
}
<div>
 search
 <input type="text">
 </div>

于 2020-09-17T11:35:56.627 回答