構建一個Bootstrap WordPress主題#8 添加一點CSS樣式

現在我們添加一些CSS樣式來使帖子看起來更好看一些:

  1. 打開style.css並使用article.post,爲每個帖子的底部加一個邊框。該
    邊框將是灰色,實心和1px。 另外,讓我們使用padding-bottom:20px和margin-bottom:30px爲底部添加一些填充
article.post{
	border-bottom: #ccc solid 1px;
	padding-bottom: 20px;
	margin-bottom: 30px;
}
  1. 我們不希望最後一篇帖子有下邊界。 我們將補充
    article.post並使用last-child來定位最後一個,我們將border-bottom設置爲none:
article.post:last-child{
	border-bottom:none;
}
  1. 對於元數據,我們使用article.post .meta爲其添加一些樣式並給它一個
    淺灰色的背景。 我們還將添加一個padding,8px和12px。 我們來添加一個
    顏色; 我們將使用深灰色:
article.post .meta{
	background-color: darkgray;
	padding: 8px 12px;
}

刷新頁面:

好看了一些

在接下來幾篇文章中,我們將學習如何使用custom-walker類設置導航欄。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章