中東元素獲得元素

Question

我想樣式列表之間的所有空間如下：

我試着用下面的HTML代碼：

<ul> 
    <li> 
    <span class="label">a</span> 
    <span class="middle-separator"></span> 
    <span class="data">aaa</span> 
    </li> 
</ul> 

但我無法找出與CSS是如何可能在中間元素上具有動態大小。

Answer 1

一個posibility是使用柔性，使中間分隔增長

應用此風格：

li { 
    list-style: none; 
    display: flex; 
} 

.middle-separator { 
    flex: 1; 
    border-bottom: 1px solid; 
}