Question

我有一个包含以下CSS的div：

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

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

Answer 1

虽然我不确定我是否理解你想要实现的目标但我找不到这个用例...通过使用javascript /添加一些span标签可以改变第二行的对齐方式jQuery（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;
}

我使用that answer来确定自动换行符。

Answer 2

添加text-align: center以使文本居中。你只是在div位置居中。

Answer 3

你可以试试css3文本对齐

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

如何使下一行中的文本居中并且不与左对齐？

3 个答案: