首頁 > web前端 > 前端問答 > css中兩端對齊的程式碼是什麼

css中兩端對齊的程式碼是什麼

WBOY
發布: 2021-12-30 15:13:02
原創
3328 人瀏覽過

在css中,設定兩段對齊的程式碼為「元素{text-align:justify;}」;「text-align」屬性用來設定指定元素文字的水平對齊方式,當屬性值設定為justify時,元素就會在水平方向上兩段對齊。

css中兩端對齊的程式碼是什麼

本教學操作環境:windows10系統、CSS3&&HTML5版、Dell G3電腦。

css中兩端對齊的程式碼是什麼

#text-align屬性指定元素文字的水平對齊方式。

屬性值如下:

  • left    把文字排列到左邊。預設值:由瀏覽器決定。   

  • right    把文字排列到右邊。   

  • center    把文字排列到中間。   

  • justify    實現兩端對齊文字效果。   

  • inherit    規定應該從父元素繼承 text-align 屬性的值。

語法如下:

元素{
text-align:justify;
}
登入後複製

範例如下:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>123</title>
    <style type="text/css">
    p{
        text-align:justify;  
    }
    p i{
        display:inline-block;
        width:100%;
    }
</style>
  </head>
  <body>
<p>两端对齐文本<i></i></p>
  </body>
</html>
登入後複製

輸出結果:

css中兩端對齊的程式碼是什麼

##(學習影片分享:

css影片教學

以上是css中兩端對齊的程式碼是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
css
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板