ios text-align:justify 和-webkit-line-clamp:2; 省略号显示与文字重合 怎么解决

在iOS中，当同时使用text-align: justify和-webkit-line-clamp:2时，可能会出现省略号与文字重合的问题。这是因为text-align: justify会导致文本末尾的空格被填充，造成省略号位置偏移。

为了解决这个问题，可以尝试以下两种方法：

1. 使用text-align: left代替text-align: justify：

text-align: left;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;

2. 使用text-overflow: ellipsis代替-webkit-line-clamp:2：

text-align: justify;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;

以上两种方法都可以避免出现省略号与文字重合的问题。同时，需要注意的是，在使用-webkit-line-clamp属性时，需要将display属性设置为-webkit-box，以及设置-webkit-box-orient属性为vertical，才能使属性生效。

相关问题

-webkit-box-orient: vertical; -webkit-line-clamp: 2; text-align: justify; ios省略号会和文字重合

这个问题的出现是因为在iOS系统中，-webkit-line-clamp属性会导致省略号的位置不正确。解决这个问题的方法是给文本容器添加一个额外的内边距(padding)，然后将设置文本容器的line-height属性与其高度相同，这样就可以让省略号正确地显示在文本的底部。

例如，你可以添加以下CSS样式：

.container {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-align: justify;
  overflow: hidden;
  padding-bottom: 1.2em; /*添加额外内边距*/
  line-height: 1.2em; /*设置行高与内边距相同*/
}

这样就可以解决iOS系统中省略号和文字重合的问题了。

uniapp的text标签text-align: justify;不生效

如果 `text-align: justify;` 在 `text` 标签上不起作用，可能是因为 `text` 标签是一个行内元素（inline element），而不是块级元素（block element）。行内元素不支持文本对齐方式（text-align）属性。

为了解决这个问题，您可以使用以下方法之一：

1. 将 `text` 标签转换为块级元素，可以使用 `display: block;`;

2. 将 `text` 标签包裹在一个块级元素中，例如 `div` 标签，并在包裹的元素上设置 `text-align: justify;`。

例如：

<div style="text-align: justify;">
  <text style="display: block;">这是一段文本</text>
</div>

或者：

<view style="text-align: justify;">
  <text>这是一段文本</text>
</view>