Screen_01

為慶祝粉絲團人數破千,分享一款新的樣式。首頁部落格採三欄式,一、二欄為文章內容,第三欄為側欄元件,採用格子狀來呈現,很喜歡這樣的設計風格,簡單耐看!不限定圖文集部落格使用,純文字部落格也可以使用。另一個側欄採用下拉式選單,可節省版面空間並簡化版面,可搭下拉式文章分類做使用。另此版面提供另一款特別款,在部落格標題背景處置入橫幅,可自行更換照片。

 

 

Screen_02

 

使用規定 <<<<<< 必看

 

 

▎CSS語法

對著文字框按右鍵可以全選,複製貼上至管理後台"自訂樣式"->"CSS原始碼編輯"

這個版本另外有個特別版,特別版的部落格標題的背景有橫幅,可自行替換照片,如下↓

9.jpg

 

▎版面設定

1 - 側欄1的元件會放置在部落格的右側,側欄2的元件會放置在部落格標題下方的下拉選單裡。

2 - 純文字部落格也可以套用。

3 - 每頁顯示文章數量請改成偶數,後台>基本/進階設定>文章顯示相關設定>每頁顯示文章數。

4 - 建議關閉公告版位

5 - 文章內圖片最佳寬度為800px,可滿版

 

▎Q&A

1 - 特別版的橫幅照片該如何替換?

修改#header裡的background屬性,橫幅照片預設為1300x350像素。

*   如果上述沒有你的問題,可參考另一篇 Q&A問答集

 

▎更新

2018/08/02 刪除上方快捷功能bar、替換橫幅照片、加入自適應功能讓版面依照瀏覽器視窗大小縮放

 

♥ 更多部落格版面分享: http://www.dribs-drabs.com/blog/post/434454491

♥ 部落格CSS語法教學: http://www.dribs-drabs.com/blog/post/437150992

創作者介紹
創作者 Dribs & Drabs 的頭像
Dribs & Drabs

Dribs & Drabs 點點 滴滴

Dribs & Drabs 發表在 痞客邦 留言(180) 人氣()