多行上的CSS省略号不适用于RTL
（Right-to-Left）是指在从右到左的语言环境中，多行文本的省略号显示效果不适用的问题。
在多行文本中，当文本内容超出容器宽度时，通常可以使用CSS的text-overflow属性来显示省略号。然而，在从右到左的语言环境中，比如阿拉伯语或希伯来语，文本的排列方向是从右到左，此时使用text-overflow属性来显示省略号会出现问题。
由于text-overflow属性默认是基于从左到右的文本排列方向设计的，因此在RTL语言环境中，多行文本的省略号显示效果可能会出现错位或不完整的情况。这是因为省略号默认是从文本的起始位置开始显示的，而在RTL语言环境中，起始位置是在文本的最右侧。
为了解决这个问题，可以使用一些其他的CSS技巧来实现多行文本的省略号效果。例如，可以使用CSS的direction属性来指定文本的排列方向，或者使用JavaScript来动态计算文本的宽度并添加省略号。
腾讯云提供了一系列云计算相关的产品和服务，包括云服务器、云数据库、云存储等。这些产品可以帮助开发者快速构建和部署各种应用程序，并提供高可用性、可扩展性和安全性。
相关链接：
相关·内容
我有这个css代码 display: block; /* Fallback for non-webkit */ max-width: 400pxlines-to-show; overflow: hidden;}
使用RTL
这对多行省略来说很好，但是当文本是RTL时，它不能，我该如何解决这个问题呢
浏览 15提问于2017-06-23得票数 5
文本溢出省略号适用于单行ltr和rtl方向，但省略号不适用于rtl方向。index.html text-overflow: ellipsis; line-height: 15px;
direction: rtl
浏览 3提问于2018-11-10得票数 2
1回答
我想知道如何截断多行文本(在我的例子中，在三行之后)&在文本居中时添加一个省略号。另一种解决方案建议隐藏/显示div w/“.”在文本div的右下角，但这并不适用于居中文本。
还有其他想法吗？
浏览 1提问于2014-06-11得票数 0
回答已采纳
1回答
在Firefox和Chrome中，两行文本都用省略号截断。在Internet中，第一行被省略号截断，第二行只在右边截断。这是我的代码：.text-wrapper { padding:10px;.text-wrapper p{
overflow:
浏览 4提问于2016-01-13得票数 3
回答已采纳
5回答
在我的网页中有一个"div“，它有固定的宽度和高度。以下css仅适用于单行文本：text-overflow: ellipsis;如何使用具有跨浏览器兼容性的纯css对该div中的文本上的多行文本应用省略号？
浏览 0提问于2015-05-28得票数 2
我的目标是创建一个具有隐藏溢出和省略号的元素，但我希望左侧的字符被隐藏，而省略号也在左边。这适用于大多数浏览器：#mydiv { white-space:nowrap;
text-overflow:ellipsis;然而，据我所知(以及对其他尝试过此操作的人的公平警告，因为我在其他地方见过direction:rtl解决方案)，唯一正确做到这一点的主
浏览 4提问于2012-08-16得票数 9
回答已采纳
根据，我们使用多行CSS省略号。我们希望检测省略号是否正在显示，并根据是否显示省略号来决定是否显示工具提示。我尝试比较offsetWidth和scrollWidth，但无论是否显示省略号，这些值都是相同的。如果任何人有任何提示，我们将非常感谢您的帮助。谢谢。
浏览 72提问于2018-09-08得票数 7
回答已采纳
2回答
如何在反应中有向左的方向反应？
、、、、
到目前为止，我已经测试了引导className="pull-right"，或者用*{direction:rtl;}和.float-right:{float:right;}手动重写了react引导组件上的CSS属性。但是，这似乎是一种失败的方法，因为它不适用于某些元素，例如
是否有任何反应框架有RTL方向？换句话
浏览 1提问于2017-12-10得票数 10
5回答
在我的角应用程序(我在4.3.1版上)中，我在多行之后添加了一个CSS省略号。 overflow: hidden;}
由于某些原因，框向行被transpile从样式中移除，导致省略号无法工作这似乎发生在棱角和离子的应用程序。
浏览 14提问于2017-09-11得票数 39
回答已采纳
2回答
如果DIV包含一个很长的句子，比如“如果每次有人告诉我不行的时候我有一毛钱”，我想展示： |everytime i was... |
通过使用下面的代码，
浏览 8提问于2013-08-28得票数 0
height: 50px; display: flex;}
text-overflow: clip; background-color: pink;}
flex:1; background-color: red;
margin: 0px 5p
浏览 3提问于2020-02-13得票数 0
回答已采纳
1回答
我被要求增加对基于xml的网站的支持。我一直在研究它，并意识到它不会是非常直接的。在描述所使用的产品时，课文中确实有英语短语。我也找到了，但这似乎行不通。
我还找到了一些使用CSS的解决方案，但这些解决方案似乎不适用于<e
浏览 4提问于2009-10-26得票数 0
回答已采纳
1回答
为复制/粘贴提供替代文本
、、、、
我很确定我以前做过这件事，但是我找不到任何关于它的文档。我发现这个问题很难研究。例如，如果我使用<div>向用户显示以下内容：...and用户选择div
浏览 2提问于2015-03-28得票数 0
overf|low of the text to be cut请注意，我希望删除溢出，这样CSS省略号属性将不适用于我。所以，基本上，我希望上面的文字看起来像这样：| This is my text inside编辑
我需要一个JavaScript函数来裁剪文本，因为我需要计算可见文本
浏览 7提问于2012-05-05得票数 15
回答已采纳
我有一个使用英文版和阿拉伯语版的ul li菜单。现在，当在阿拉伯语版本中，菜单必须是反向顺序时，我们如何才能确定我的代码是 <li><a href="..
浏览 0提问于2012-12-15得票数 0
回答已采纳
10回答
左侧文本溢出省略
、、
我有一个路径列表(因为没有一个更好的词，也许面包屑路径更好地描述了它们)。有些值太长，无法在父文件中显示，所以我使用text-overflow: ellipsis。问题是重要的信息在右边，所以我希望省略号出现在左边。> sixth > seventh|注意，第一行足够短，所以它保持左对齐，但另外两行太长，因此省略号出现在左侧。我更喜欢CSS唯一的解决方案，但是JS如果不能避免的话就可以了。如果这个解决方案只适
浏览 12提问于2012-03-20得票数 80
回答已采纳
我在输入文本中设置了direction=rtl，但在Safari和Chrome中，光标总是停留在左侧，而在其他浏览器中，光标保持在右侧。 direction: rtl;First name:<br><br><input type="text" name="lastname">为什么这
浏览 5提问于2016-08-10得票数 2
回答已采纳
4回答
我正在尝试构建一个具有多行textfield的组件。如果输入的文本超过2行，那么我想添加省略号(.)因为文本溢出。如何通过操作css仅显示显示的省略号，而不修改将存储为“.”的实际文本来实现这一点？谢谢
浏览 2提问于2018-11-05得票数 12
回答已采纳
我使用DataPager对ListView进行分页，并将NumericPagerField的ButtonCount属性设置为5，以将显示的页码的最大数量限制为5。但是这样做，当页面超过5页时，它会显示1到2个省略号(...)。有没有办法设置这些椭圆的样式或使它们消失？
编辑:我想澄清这一点。我想要做的是，当页面总数超过ButtonCount属性时，隐藏DataPager中的省略号(可能是通过样式display:none，但我找不到一种方法来设置它<em
浏览 1提问于2012-08-21得票数 2
回答已采纳
目前，为了限制文本框的垂直方向，并添加省略号，只有一种webkit css3解决方案使用线夹和方框定向。现在，这在其他任何地方都不受支持，甚至不使用前缀。所以我的问题是，是否有可能在纯javascript中轻松地做到这一点。简而言之，让一个句子排在多行上，并在添加省略号的同时在几行之后停止它。
谢谢你的帮助。
浏览 2提问于2012-08-08得票数 4
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
