如何用HTML和CSS創建一個小時的操作列表？

Question

我很難搞清楚如何正確創建一個使用基本的html和css操作幾個小時的列表。

我試圖做2列。左欄爲星期幾（text-align:right;），右側爲小時（text-align:left;），以便一天的右邊緣和小時的左邊緣在中心對齊。

有沒有辦法做到這一點，並保持2個列表項目中心？

這可以通過<dl>或2 <ul>完成嗎？

這裏是一個視覺Example

右：

Sunday: Closed 
    Monday: 9am - 5pm 
    Tuesday: 9am - 5pm 
Wednesday: 9am - 5pm 
Thursday: 9am - 5pm 

錯誤：

Sunday: Closed 
Monday: 9am - 5pm 
Tuesday: 9am - 5pm 
Wednesday: 9am - 5pm 
Thursday: 9am - 5pm 

Answer 1

您可以使用正常的<table>元素這一點。由於你的數據實際上是一張表，所以在這裏使用它並不令人羞恥。或者dl也可能有效。

th { 
 
    text-align: right; 
 
}

<table> 
 
<tr><th>Sunday</th><td>Closed</td></tr> 
 
<tr><th>Monday</th><td>9am - 5pm</td></tr> 
 
<tr><th>Tuesday</th><td>9am - 5pm</td></tr> 
 
<tr><th>Wednesday</th><td>9am - 5pm</td></tr> 
 
<tr><th>Thursday</th><td>9am - 5pm</td></tr> 
 
</table>