如何根據垂直中間使邊框的高度爲

Question

我是亞洲人。我很抱歉，因爲我不擅長英語寫作和語法。

我正在設計一個使用HTML，JSP，CSS的公告板的視圖頁面，我正在使用標記來實現它。

我想實現與標籤之間的區分權線，書寫信息如作者，查看的編號，標題等。像底部圖像。線看起來像應用的垂直 - 中線的高度值。 我想實現這個使用CSS屬性相關的右邊界。

我該如何使用CSS來設計？請T.T ;;

請參考我要製作的底部考試圖片。 問候，

Answer 1

您可以通過應用做到這一點的CSS border屬性一樣 - 右邊框：粗槽黑; 或 您可以在內容之間應用標記約定，如|。 我希望我的回答可以幫助你。 如果有，請升級我。

Answer 2

請看看這是你所需要的

.overview { border-top: medium solid darkgray; } 
 
.row { 
 
    width: 100%; 
 
    padding: 0.2em 0; 
 
    border-bottom: thin solid darkgray; 
 
} 
 

 
span { 
 
    display: inline-block; 
 
    min-width: 6em; 
 
    padding: 0 1em; 
 
} 
 

 
.h6 { 
 
    font-weight: 600; 
 
    text-align: center; 
 
} 
 

 
.b-r { 
 
    border-right: thin solid darkgray; 
 
}

<div class="overview"> 
 
    <div class="row"> 
 
    <span class="h6 b-r">title</span> 
 
    <span>today's calendar</span> 
 
    </div> 
 
    <div class="row"> 
 
    <span class="h6 b-r">writer</span> 
 
    <span class="b-r">administrator</span> 
 
    <span class="h6 b-r">date</span> 
 
    <span class="b-r">2017-06-15</span> 
 
    </div> 
 
    <div class="row"> 
 
    <span class="h6 b-r">appended file</span> 
 
    <span>TimeTable.pdf</span> 
 
    </div> 
 
</div>