CSS中的列表右對齊是一個非常常見的需求。下面我們來看一下具體實現(xiàn)方法。
ul{ list-style: none; text-align: right; padding-left: 0; } li{ display: inline-block; margin-left: 10px; }
上述代碼中,我們將列表設(shè)置為無序列表,去除了原本的默認樣式。然后使用text-align:right將列表內(nèi)的所有內(nèi)容右對齊。接著,我們將每個list item設(shè)置為inline-block,這樣就可以讓它們水平排列。最后為了保證間隔美觀,我們給每個li加上了一個左側(cè)的margin。
需要注意的是,如果列表的父元素是左對齊的,那么在列表右對齊的時候,可能會出現(xiàn)殘留的空白。如果這個問題發(fā)生了,請將其父元素也做相應(yīng)的右對齊處理。