css之文字兩端對齊

2022-01-15 05:20:35 字數 379 閱讀 5593

在進行網頁設計時,我們經常會看到這樣的樣式:文字兩端對齊。

css為我們提供了乙個屬性可以實現這樣的效果:text-align: justify。不過這個只能用來設定多行文字(除最後一行)。如果只有單行的話,是不起效果的。那怎麼辦呢?這裡有兩種解決方案:

借助偽元素或者內聯元素使文字不是最後一行。具體**:

scss**:

form 

}}}

text-align-last: justify;

scss**:

form 

}}

第二種方法並不是所有瀏覽器都相容,

CSS之文字兩端對齊

說起text align,大家一定都不覺得陌生,我們常用關鍵字left right center實現行內元素相對父元素左 右 居中對齊,當然我們也使用justify來實現文字兩端對齊。如上圖,兩端對齊相對於左對齊,視覺上顯得整齊有序。但justify對最後一行無效,通常這樣的排版對整段文字是極好的,...

css實現文字兩端對齊

實現如下效果 css 實現如下 第一種方案 oldprice label oldprice label after active lists nowprice active lists nowprice label active lists nowprice points 原價 50元 首單價200...

文字兩端對齊

學習貼 最近在工作專案中接觸到web介面設計的問題,要實現文字兩端對齊的效果。在網上搜尋了一下,用的都是類似的技巧 text align justify text justify inter ideograph 我遇到問題是 看不到效果,無論是英文還是中文,在ie和chrome下都不起作用。還好在s...