0

我有一个具有以下 CSS 的 div：

 .div_stuff {
 width: 830px;
 margin: 20px auto;
 font-size:22px;
 }

如何防止转到下一行的文本在上面的文本下方不左对齐，而只是在下一行居中？

4

3 回答 3

2

虽然我不确定我是否理解您想要实现的目标并且我找不到此用例......通过添加一些带有 javascript/jQuery 的 span 标签（DEMO ）可以从第二行更改对齐方式):

$(function() {
    var box = $('.div_stuff');
    var text = box.text();

    var words = text.split(' ');
    box.text(words[0]);
    var height = box.height();
    var chars = 0;
    for(var i = 1; i < words.length; i++){
        box.text(box.text() + ' ' + words[i]);
        chars += words[i-1].length + 1;
        if(box.height() > height){
            height = box.height();      
            box.html('<span class="first-line">' + text.substring(0,chars) + '</span><span class="following-lines">' + text.substring(chars+1, text.length)+'</span>');
            break;
        }
    }
});

并为它们设置不同的对齐方式：

span {
    display: block;
}

.first-line {
    text-align: left;
}

.following-lines {
    text-align: center;
}

我已经使用该答案来确定自动换行符。

于 2013-05-10T19:44:55.883 回答
1

添加text-align: center以使文本居中。您仅将 div 位置居中。

于 2013-05-10T19:26:52.953 回答
0

you can try css3 text justified

http://www.w3schools.com/cssref/css3_pr_text-justify.asp

于 2013-05-10T19:22:17.540 回答