如何居中對齊文本？CSS

Question

我有這個例子：

http://jsfiddle.net/BRxKX/4477/

這是代碼HTML：

    <div class="container-fluid">
    <div class="row">
     <div class="col-sm-4 col-md-12 col-lg-12 " style="font-size:17px;color:white;">
<p class="text-left">- onorarii fixe;<br>
– onorarii orare, <br>
– onorarii orare şi fixe;<br>
– onorarii periodice;<br>
– onorarii de succes, în funcţie de rezultatul sau serviciul furnizat.
</p>
<p></p></div>

    </div>

</div>

這是代碼CSS：

.row
{
    background:blue;
    width:100%:
    color:white;

}

我的文本中的每一行都有以“-”開頭的行。 如果我們應用"text-align: center"我的文本將與中心對齊，但縮進將無法正確排列

我希望文本與現在完全一樣，但要與中心對齊。您能幫我解決這個問題嗎？

提前致謝！

Answer 1

在CSS中，添加以下內容：

.row p {
    margin-left: 40%;
}

並根據自己的喜好調整左邊距。 40％是關於中心的，但是您可以更改。 另外，無需更改HTML。 這是一個演示 。

Answer 2

.row
{
    background:blue;
    width:100%:
    color:white;
    margin-left:30%;
    float:left;
}

• 始終使用CSS框模型進行文本對齊。
• Float：left->即使瀏覽器的寬度/高度增加或減小，也將有助於使文本居中。

http://jsfiddle.net/e8z2pb3p/

Answer 3

一種方法是使用一個wrapper元素來設置文本的左對齊，然后您的實際文本可以只是一個塊元素，其寬度設置為看起來不錯，並具有auto左右邊距。

 .text-left-align-center{ display: block; text-align: left; } .text-left-align-center p{ display: block; margin-left: auto; margin-right: auto; width: 30%; /*whatever width is needed for your text */ } 

 <div class="text-left-align-center"> <p> - onorarii fixe;<br> – onorarii orare, <br> – onorarii orare şi fixe;<br> – onorarii periodice;<br> – onorarii de succes, în funcţie de rezultatul sau serviciul furnizat. </p> </div>