Question

如何证明这个文本的合理性？我已经尝试并搜索了几天以获得如此简单的工作......

例如：

HTML：

<div id="justify">
   <p>I just want this to justify..</p>
</div>

CSS：

#justify {
    width: 100%;
    background: #D33;
}

#justify p {
    margin: 0 auto;
    max-width: 70%;
    list-style: disc outside none;
    text-align: justify;
    display: list-item;
    background: #ccc;
    }

这里是JSFiddle：

http://jsfiddle.net/xDqwF/

非常感谢任何帮助。

Answer 1

#justify p:after {
  content: "";
  display: inline-block;
  width: 100%;
}

通过一些HTML Trickery，这应该有效。当我遇到类似的问题时，我在很久以前的博客文章中找到了它。在JSFiddle上查看它

http://jsfiddle.net/xDqwF/2/

Answer 2

这很简单，将文本放在<p>中，在CSS中编辑它：

<强> HTML：

<div>
  <p id="justify">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.ultricies n.</p>
</div>

<div>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.ultricies n.</p>
</div>

<强> CSS：

div {
    height:200px;
    width:350px;
}

#justify {      
    text-align: justify;
}

Live demo

Answer 3

<html>
    <head>
        <style type="text/css">
            .justify {
                text-align: justify;
                text-justify: inter-word;
            }
        </style>
    </head>
    <body>
        <div class="justify">
            <p>This is justified</p>
        </div>
    </body>
</html>

Answer 4

根据W3C学校的文字证明只支持IE，但是从IE 5.5开始就支持

text-align可以指定理由，如上所述，但有些注意事项：

在所有浏览器中，我检查过对齐是通过增加字间距来处理的。典型的剩余空间量为2-4个字符。按照典型的10个字左右划分，看起来可以接受。
在字数较少的行上，剩余空间在较少的空间中被吸收。结果是差距很大。这是多列布局中的问题，或者是纵向图片下的标题。

关于良好DTP程序的FWIW，用于对齐的空间在字间空间和字母间距之间分开。良好的字体在字距调整提示的内部表中有控制这个间距。（你不能在“Y”和“o”之间放置尽可能多的空间，而不是看起来很奇怪。）

证明段落文本HTML

4 个答案: