如何使用 CSS 固定 Span 元素的寬度並對齊無序列表中的文字？

CSS 固定寬度跨度對齊

當嘗試固定跨度元素內的文字寬度時，尤其是當嵌入無序列表中。目標是對齊 span 之後的文本，以創建更清晰的視覺呈現。

要實現此目的，一個簡單的CSS 解決方案涉及為span 元素分配以下屬性：

span {
  display: inline-block;
  width: 50px;
}

這種方法利用了display: inline-block 屬性，該屬性指示span的行為類似內聯元素和區塊元素。透過指定 50px 的寬度，跨度將具有固定寬度，無論其內容為何。

雖然此解決方案在大多數現代瀏覽器中有效，但 Firefox 2 及更早版本不支援 inline-block 屬性。在這種情況下，可以使用 -moz-inline-box 屬性作為替代方案。但是，必須注意 -moz-inline-box 的行為與 inline-block 略有不同，並且可能無法在所有情況下一致地呈現。

以上是如何使用 CSS 固定 Span 元素的寬度並對齊無序列表中的文字？的詳細內容。更多資訊請關注PHP中文網其他相關文章！