最近在做專案的時候，遇到了乙個中間文字，兩邊橫線的布局，如下圖：
第一種：
**如下：
到底了
第二種：
後來，在網上找到了不同的方法，**如下：
產品清單
vertical-align 的屬性就會發現有length 和 % 兩個屬性:
第三種：
使用css偽類來實現
暫無資料
css實現中間文字，兩邊橫線效果
1.vertical align屬性實現效果 vertical align 屬性設定元素的垂直對齊方式。該屬性定義行內元素的基線相對於該元素所在行的基線的垂直對齊。允許指定負長度值和百分比值。div class header span class line span span class text ...
中間文字，兩邊橫線的css3偽元素的使用
先介紹下偽類和偽元素 偽類 操作的是在dom結構中已經存在的元素，可以對它進行一些樣式的調整，比如 active,hover等，一般用單冒號，感覺像是給元素新增乙個class，然後設定樣式 偽元素 操作的是在dom結構中不存在的元素，比如 after,before等，可以對新新增的元素設定樣式等，一...
css實現兩邊固定，中間自適應
經常有需求，所以就總結一下，有需要的時候直接複製貼上啦 布局的原理是margin負值法。首先需要在center元素外部包含乙個div，包含div需要設定float屬性使其形成乙個bfc，並設定寬度，並且這個寬度要和left塊的margin負值進行配合，具體原理參考這裡。這裡對聖杯布局解釋特別詳細。h...