CSS文字兩端對齊


  在網上學習的方法,解決了單靠text-align:justify無法實現文字兩端對齊的問題。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
      <style>
            p{width:100px; text-align:justify; }
            p > span{display:inline-block; padding-left:100%; }
         </style>
</head>
<body>
    <p>兩 端 對 齊<span></span></p>
</body>
</html>

  幾個注意的問題:

  1、在需要兩端對齊的文字后面那加上一對空的<span>標簽,並設置樣式(如代碼)。

  2、在代碼中每個中文都需要用空格隔開,不然不會有效果。

  實現這個效果的原理我沒搞明白,如果有大神閑逛看到不妨給我解釋下。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM