Question

我试图证明这个p标签中的文本是正确的，这样它就完全符合p的宽度。

<p align="justify" style="text-align: justify !important; color:#fff; margin:0px; font-weight:bold; width:487px; border:Solid 1px red;">blah blah blah</p>

但文字不合理！任何想法为什么？

感谢您的帮助。

Answer 1

您可以使用此处描述的解决方案： http://blog.vjeux.com/2011/css/css-one-line-justify.html

这样可以证明单行是合理的，但是后面会添加一个空格，所以如果你知道高度，你可以用overflow:hidden指定它来隐藏它并仍然得到理由。

.fulljustify {
    	text-align:justify;
    }
    .fulljustify:after {
        content: "";
        display: inline-block;
        width: 100%;	
    }
    #tagline {
        height: 80px;
        overflow: hidden;
        line-height: 80px; /* vert-center */
    }

<p id="tagline" class="fulljustify">Blah blah blah</p>

Answer 2

如果您的文字不超过一行，则证明不会做任何事情。你的文本必须换行到下一行，然后FIRST行将被证明，但不是第二行。

Answer 3

如果您想在487px中证明四个单词的合理性，可以尝试在word-spacing中使用css。

我将word-spacing:8em;用于bla bla bla bla，但您可以根据需要进行调整。

http://jsfiddle.net/5RpQr/1/

Answer 4

Chrome不支持，但在Firefox和IE中，您可以使用text-align-last: justify;。对于跨浏览器解决方案，我们必须使用@onemanarmy发布的内容;）

Answer 5

试试这个

表示div

div {
text-align:justify;
text-justify: inter-word;
text-align-last:center;
/* for IE9 */
-ms-text-align-last:center;
}

Answer 6

还有类似的东西，比如display：flex;辩解内容：空间;如果你将这些文本包装在跨度或div中

Answer 7

对于我的

标签，可以通过简单的方式工作：

p {
  text-align: justify;
  text-justify: inter-word;
}

https://css-tricks.com/almanac/properties/t/text-justify/

Answer 8

要使其在Chrome和Opera上看起来不错（多行对齐在它们上看起来不好）

我使用以下

.fulljustify {
  text-align: justify;
  display: table-row;
  text-align-last: left;
}

Answer 9

只需使用style="text-align:justify" 它适用于所有浏览器。

Answer 10

你最好试试

style="text-align:justifty;display:inline-block;"

text-align证明不起作用

10 个答案: