
全文轉載:
[TextCube] 自訂樣板超完整教學首先,這個教學是完全參考官方設置的方式,所以如果有需要的話,可以去官方的部落格看看會比較完整,只是都是韓文就是了。網址在此:
http://www.textcube.org/manual/category/스킨以官方樣板 coolant 為範例來說明,他總共有兩個資料夾,五個檔案:
- skin.html (必要)
- style.css (必要)
- index.xml (必要)
- preview.gif (樣板預覽縮圖,非必要)
- wysiwyg.css (樣板專用編輯器樣式,非必要)
- /images (樣板用資料夾,可自行建立與更名)
- /styles (樣板用資料夾,可自行建立與更名)
首先先來看 skin.html 這支樣板核心檔案,它的基本結構如下:
<div id="container">
<div id="header"></div> <!-- header close -->
<div id="content"></div> <!-- content close -->
<div id="sidebar"></div> <!-- sideinfo close -->
<div id="footer"></div> <!-- footer close -->
</div> <!-- container close -->
詳細結構如下:
<div id="container">
<div id="header">
<h1>標題</h1>
<div class="menu">選單</div>
</div>
標題設定..
可以使用的替換標籤有:
[##_blog_link_##],顯示部落格主要網址
[##_title_##],顯示部落格標題
[##_localog_link_##],顯示地域網址
[##_taglog_link_##],顯示標籤網址
[##_guestbook_link_##],顯示訪客留言網址
附註:也可以使用 [##_blog_link_##]tag 來表示標籤網址,依此類推。這裡的替代標籤全樣板皆可通用,並不限於用在標題選單內。
標題設定..
<!-- header close -->
<div id="content">
<div class="searchList">搜尋本文結果清單</div>
包含的 XML 結構:<s_list>, </s_list>
可以使用的替換標籤有:
[##_list_conform_##],搜尋的關鍵字詞
[##_list_count_##],搜尋的結果數目
包含 XML 子結構:<s_list_rep>, </s_list_rep>
[##_list_rep_link_##],文章鏈結
[##_list_rep_regdate_##],文章時間
[##_list_rep_title_##],文章標題
[##_list_rep_author_##],文章作者
[##_list_rep_rp_cnt_##],文章回應數目
<div class="searchRplist">搜尋回應/引用結果清單</div>
包含的 XML 結構:<s_rplist>, </s_rplist>
可以使用的替換標籤有:
[##_rplist_count_##],搜尋回應結果的數目
包含 XML 子結構:<s_rplist_rep>, </s_rplist_rep>
可以使用的替換標籤有:
[##_rplist_rep_link_##],回應鏈結
[##_rplist_rep_regdate_##],回應時間
[##_rplist_rep_body_##],回應內容
[##_rplist_rep_name_##],回應作者
包含的 XML 結構:<s_tblist>, </s_tblist>
可以使用的替換標籤有:
[##_tblist_count_##],搜尋引用結果的數目
[##_tblist_conform_##],搜尋引用結果的關鍵字詞
包含 XML 子結構:<s_tplist_rep>, </s_tplist_rep>
可以使用的替換標籤有:
[##_tplist_rep_link_##],引用來源鏈結
[##_tplist_rep_subject_##],引用來源標題
[##_tplist_rep_regdate_##],引用來源時間
[##_tplist_rep_body_##],引用來源內容
[##_tplist_rep_name_##],引用來源作者
<div class="localog">地域</div>
包含的 XML 結構:<s_local>, </s_local>
可以使用的替換標籤有:
[##_location_link_##],地域鏈結網址
包含 XML 子結構:<s_local_spot_rep>, </s_local_spot_rep>
可以使用的替換標籤有:
[##_local_spot_depth_##],地域分類深度(層級)
[##_local_spot_##],地域分類名稱
包含 XML 子結構:<s_local_info_rep>, </s_local_info_rep>
可以使用的替換標籤有:
[##_local_info_depth_##],文章深度(層級)
[##_local_info_link_##],文章鏈結
[##_local_info_title_##],文章標題
[##_local_info_author_##],文章作者
<div class="taglog">標籤</div>
包含的 XML 結構:<s_tag>, </s_tag>
可以使用的替換標籤有:
[##_taglog_link_##],標籤鏈結
包含 XML 子結構:<s_tag_rep>, </s_tag_rep>
可以使用的替換標籤有:
[##_tag_link_##],標籤文字鏈結
[##_tag_class_##],標籤樣式名稱
[##_tag_name_##],標籤文字
<div class="guestbook">訪客留言
<div class="guestWrite">訪客留言表單編輯區域</div>
<div class="guestList">訪客留言清單</div>
包含的 XML 結構:<s_tag>, </s_tag>
可以使用的替換標籤有:
[##_guestbook_link_##],訪客留言鏈結
包含 XML 子結構:<s_guest_input_form>, </s_guest_input_form>
可以使用的替換標籤有:
[##_guest_textarea_body_##],訪客留言輸入框
[##_guest_onclick_submit_##],訪客留言傳送按鈕程序
包含 XML 子結構:<s_member_form>, </s_member_form>
可以使用的替換標籤有:
[##_guest_input_is_secret_##],留言是否保密
包含 XML 子結構:<s_guest_form>, </s_member_form>
可以使用的替換標籤有:
[##_guest_input_name_##],訪客姓名樣式名稱
[##_guest_name_##],訪客姓名(使用 Cookie 記錄)
[##_guest_input_password_##],訪客密碼樣式名稱
[##_guest_password_##],訪客密碼(使用 Cookie 記錄)
[##_guest_input_homepage_##],訪客網站網址樣式名稱
[##_guest_homepage_##],訪客網站網址(使用 Cookie 記錄)
包含 XML 子結構:<s_guest_container>, </s_guest_container>
包含 XML 子結構:<s_guest_rep>, </s_guest_rep>
可以使用的替換標籤有:
[##_guest_rep_id_##],訪客留言清單樣式識別 ID
[##_guest_rep_class_##],訪客留言清單樣式識別 CLASS
[##_guest_rep_name_##],訪客名稱
[##_guest_rep_date_##],留言日期時間
[##_guest_rep_onclick_delete_##],訪客留言修改刪除按鈕程序
[##_guest_rep_onclick_reply_##],訪客留言回覆留言按鈕程序
[##_guest_rep_link_##],訪客留言主要網址
[##_guest_rep_desc_##],訪客留言本文內容
包含 XML 子結構:<s_guest_reply_container>, </s_guest_reply_container>
包含 XML 子結構:<s_guest_reply_rep>, </s_guest_reply_rep>
可以使用的替換標籤有:
[##_guest_rep_id_##],訪客留言清單樣式識別 ID
[##_guest_rep_class_##],訪客留言清單樣式識別 CLASS
[##_guest_rep_name_##],訪客名稱
[##_guest_rep_date_##],留言日期時間
[##_guest_rep_onclick_delete_##],訪客留言修改刪除按鈕程序
[##_guest_rep_link_##],訪客留言主要網址
[##_guest_rep_desc_##],訪客留言本文內容
</div><!-- guestbook close -->
<div class="entryNotice">公告文章</div>
包含的 XML 結構:<s_notice_rep>, </s_notice_rep>
可以使用的替換標籤有:
[##_notice_rep_link_##],公告文章鏈結網址
[##_notice_rep_title_##],公告文章標題
[##_notice_rep_date_##],公告文章日期
[##_notice_rep_desc_##],公告文章本文
[##_notice_rep_author_##],公告文章作者
<div class="entryProtected">被保護的文章</div>
包含的 XML 結構:<s_article_protected>, </s_article_protected>
可以使用的替換標籤有:
[##_article_rep_link_##],文章鏈結網址
[##_article_rep_title_##],文章標題
[##_article_rep_date_##],文章日期
[##_article_rep_author_##],文章作者
[##_article_password_##],文章密碼樣式
[##_article_dissolve_##],文章按鈕傳送程序
<div class="entry">文章
<div class="titleWrap">文章標題、分類、作者、文章詳細資訊、文章操作</div>
<div class="article">本文</div>
<div class="tagTrail">標籤清單</div>
<div class="actionTrail">引用操作、刪除</div>
<div class="trackback">引用清單</div>
<div class="comment">回應
<div class="commentList">回應清單</div>
<div class="commentWrite">回應表單編輯區域</div>
</div>
包含的 XML 結構:<s_article_rep>, </s_article_rep>
可以使用的替換標籤有:
[##_article_rep_link_##],文章鏈結網址
[##_article_rep_title_##],文章標題
[##_article_rep_date_##],文章日期
[##_article_rep_category_##],文章分類
[##_article_rep_desc_##],文章本文內容
[##_article_rep_author_##],文章作者
[##_article_rep_tb_cnt_id_##],文章引用樣式識別 ID
[##_article_rep_tb_link_##],文章引用鏈結網址
[##_article_rep_rp_cnt_id_##],文章回應樣式識別 ID
[##_article_rep_rp_link_##],文章回應鏈結網址
[##_article_rep_response_rssurl_##],文章回應 RSS 訂閱
包含 XML 子結構:<s_ad_div>, </s_ad_div>
可以使用的替換標籤有:
[##_s_ad_s1_label_##],文章狀態
[##_s_ad_s2_label_##],文章狀態
[##_s_ad_s2_on_click_##],文章狀態變更按鈕程序
[##_s_ad_m_link_##],文章編輯鏈結
[##_s_ad_m_onclick_##],文章編輯程序(在彈出視窗中編輯)
[##_s_ad_t_onclick_##],文章發送引用程序
[##_s_ad_d_onclick_##],文章刪除程序
包含 XML 子結構:<s_tag_label>, </s_tag_label>
可以使用的替換標籤有:
[##_tag_label_rep_##],文章標籤清單
包含 XML 子結構:<s_tb_count>, </s_tb_count>
可以使用的替換標籤有:
[##_article_rep_tb_cnt_##],文章引用數目
包含 XML 子結構:<s_rp_count>, </s_rp_count>
可以使用的替換標籤有:
[##_article_rep_rp_cnt_##],文章回應數目
包含 XML 子結構:<s_tb>, </s_tb>
可以使用的替換標籤有:
[##_tb_address_##],文章引用位址
包含 XML 子結構:<s_tb_container>, </s_tb_container>
包含 XML 子結構:<s_tb_rep>, </s_tb_rep>
可以使用的替換標籤有:
[##_tb_rep_id_##],文章引用樣式識別 ID
[##_tb_rep_url_##],文章引用位址
[##_tb_rep_title_##],文章引用標題
[##_tb_rep_site_##],引用本文章的網站位址
[##_tb_rep_date_##],引用本文章的文章日期
[##_tb_rep_onclick_delete_##],刪除引用文章的按鈕程序
[##_tb_rep_desc_##],引用本文章的文章內容
包含 XML 子結構:<s_rp>, </s_rp>
包含 XML 子結構:<s_rp_container>, </s_rp_container>
可以使用的替換標籤有:
[##_article_rep_rp_rssurl_##],文章回應 RSS 訂閱
包含 XML 子結構:<s_rp_rep>, </s_rp_rep>
可以使用的替換標籤有:
[##_rp_rep_id_##],回應樣式識別 ID
[##_rp_rep_class_##],回應樣式識別 CLASS
[##_rp_rep_name_##],回應作者名稱
[##_rp_rep_date_##],回應日期
[##_rp_rep_link_##],回應主要網址
[##_rp_rep_onclick_delete_##],回應編輯/刪除按鈕程序
[##_rp_rep_onclick_reply_##],回應回覆按鈕程序
[##_rp_rep_desc_##],回應本文內容
包含 XML 子結構:<s_rp2_container>, </s_rp2_container>
可以使用的替換標籤有:
[##_rp_rep_id_##],回應樣式識別 ID
[##_rp_rep_class_##],回應樣式識別 CLASS
[##_rp_rep_name_##],回應作者名稱
[##_rp_rep_date_##],回應日期
[##_rp_rep_link_##],回應主要網址
[##_rp_rep_onclick_delete_##],回應編輯/刪除按鈕程序
[##_rp_rep_desc_##],回應本文內容
包含 XML 子結構:<s_rp_input_form>, </s_rp_input_form>
可以使用的替換標籤有:
[##_rp_input_comment_##],回應內容輸入框
[##_rp_onclick_submit_##],回應傳送按鈕程序
包含 XML 子結構:<s_rp_member>, </s_rp_member>
可以使用的替換標籤有:
[##_article_rep_id_##],回應文章識別用 ID
[##_rp_input_is_secret_##],回應是否為保密
包含 XML 子結構:<s_rp_guest>, </s_rp_guest>
可以使用的替換標籤有:
[##_article_rep_id_##],回應文章識別用 ID
[##_rp_input_name_##],回應姓名樣式名稱
[##_rp_name_##],回應姓名(使用 Cookie 記錄)
[##_rp_input_password_##],回應密碼樣式名稱
[##_rp_password_##],回應密碼(使用 Cookie 記錄)
[##_rp_input_homepage_##],回應網站網址樣式名稱
[##_rp_homepage_##],回應網站網址(使用 Cookie 記錄)
</div> <!-- entry close -->
<div class="paging">分頁</div>
包含的 XML 結構:<s_paging>, </s_paging>
可以使用的替換標籤有:
[##_prev_page_##],上一頁鏈結
[##_next_page_##],上一頁鏈結
包含 XML 子結構:<s_paging_rep>, </s_paging_rep>
可以使用的替換標籤有:
[##_paging_rep_link_##],分頁鏈結網址
[##_paging_rep_link_num_##],分頁鏈結
</div><!-- content close -->
<div id="sidebar">
側邊欄位最大外框 XML 結構:<s_sidebar>, </s_sidebar>
只要是用這個最大外框框起來的都屬於側邊欄位,依照 TextCube 會自動編號。
<s_sidebar><!-- 這個 HTML 註釋可當作後端側邊欄位的說明 --> ... </s_sidebar>
包含 XML 子結構:<s_sidebar_element>, </s_sidebar_element>
只要用這個子結構包起來的區塊,都是側邊欄位的成員(元件)之一。
<s_sidebar_element><!-- 這個 HTML 註釋可當作後端成員(元件)的說明 --> ... </s_sidebar_element>
<div class="blogImage">部落格識別圖示</div>
可以使用的替換標籤有:
[##_image_##],部落格識別圖示位址
[##_desc_##],部落格描述文字
[##_blogger_##],部落格作者名稱
<div class="notice">公告</div>
包含的 XML 結構:<s_rct_notice>, </s_rct_notice>
包含 XML 子結構:<s_rct_notice_rep>, </s_rct_notice_rep>
可以使用的替換標籤有:
[##_notice_rep_link_##],公告鏈結網址
[##_notice_rep_title_##],公告標題
[##_notice_rep_author_##],公告作者名稱
<div class="adminMenu">管理者操作</div>
可以使用的替換標籤有:
[##_owner_url_##],部落格作者後台網址鏈結
<div class="search">搜尋</div>
可以使用的替換標籤有:
[##_search_name_##],搜尋框程序識別名稱
[##_search_text_##],搜尋框內容
[##_search_onclick_submit_##],搜尋按鈕程序
<div class="category">分類</div>
可以使用的替換標籤有:
[##_category_list_##],列出分類清單
[##_category_##],列出分類清單
<div class="tagbox">標籤</div>
包含 XML 子結構:<s_random_tags>, </s_random_tags>
可以使用的替換標籤有:
[##_tag_link_##],標籤鏈結
[##_tag_class_##],標籤樣式識別用 CLASS
[##_tag_name_##],標籤名稱
<div class="recentPost">最新文章</div>
包含 XML 子結構:<s_rctps_rep>, </s_rctps_rep>
可以使用的替換標籤有:
[##_rctps_rep_link_##],最新文章鏈結
[##_rctps_rep_title_##],最新文章標題
[##_rctps_rep_rp_cnt_##],最新文章回應數目
[##_rctps_rep_author_##],最新文章作者
<div class="recentComment">最新回應</div>
包含 XML 子結構:<s_rctrp_rep>, </s_rctrp_rep>
可以使用的替換標籤有:
[##_rctrp_rep_link_##],最新回應鏈結
[##_rctrp_rep_desc_##],最新回應本文
[##_rctrp_rep_name_##],最新回應作者
[##_rctrp_rep_time_##],最新回應時間
<div class="recentTrackback">最新引用</div>
包含 XML 子結構:<s_rcttb_rep>, </s_rcttb_rep>
可以使用的替換標籤有:
[##_rcttb_rep_link_##],最新引用鏈結
[##_rcttb_rep_desc_##],最新引用本文
[##_rcttb_rep_name_##],最新引用作者
[##_rcttb_rep_time_##],最新引用時間
<div class="archive">日期歸檔</div>
包含 XML 子結構:<s_archive_rep>, </s_archive_rep>
可以使用的替換標籤有:
[##_archive_rep_link_##],日期歸檔鏈結
[##_archive_rep_date_##],日期歸檔日期
[##_archive_rep_count_##],日期歸檔文章數目
<div class="calender">日曆</div>
可以使用的替換標籤有:
[##_calendar_##],顯示日曆
<div class="link">鏈結</div>
可以使用的替換標籤有:
[##_link_list_##],自動顯示鏈結
手動設定鏈結顯示使用包含 XML 子結構:<s_link_rep>, </s_link_rep>
可以使用的替換標籤有:
[##_link_url_##],鏈結位址
[##_link_site_##],鏈結名稱
<div class="counter">部落格瀏覽計數</div>
可以使用的替換標籤有:
[##_count_total_##],總瀏覽次數
[##_count_today_##],今日瀏覽次數
[##_count_yesterday_##],昨日瀏覽次數
<div class="botton">其它</div>
可以使用的替換標籤有:
[##_rss_url_##],RSS 文章訂閱位址
[##_response_rss_url_##],RSS 回應訂閱位址
[##_atom_url_##],ATOM 文章訂閱位址
[##_response_atom_url_##],ATOM 回應訂閱位址
附註:這裡的替代標籤全樣板皆可通用,並不限於用在側邊欄內。
</div><!-- sideinfo close -->
<div id="footer">
<div class="menu">選單</div>
<div class="copyright">Copyright</div>
可以使用的替換標籤有:
[##_tattertools_name_##],TextCube 版本名稱
[##_tattertools_version_##],TextCube 版本號碼
[##_blogger_##],部落格作者暱稱
附註:這裡的替代標籤全樣板皆可通用,並不限於用在文末。
</div>
</div> <!-- container close -->
額外的兩種 skin.html 設定:
聚合頁面 cover
包含的 XML 結構:<s_cover>, </s_cover>
包含 XML 子結構:<s_cover_rep>, </s_cover_rep>
可以使用的替換標籤有:
[##_cover_content_##],顯示聚合頁面所有內容
關鍵字 Keyword UI
包含的 XML 結構:<s_keyword>, </s_keyword>
包含 XML 子結構:<s_keyword_rep>, </s_keyword_rep>
可以使用的替換標籤有:
[##_onclick_keyword_##],關鍵字按鈕程序
[##_keyword_label_##],關鍵字標簽名稱
包含的 XML 結構:<s_keyword_rep>, </s_keyword_rep>
可以使用的替換標籤有:
[##_keyword_rep_title_##],關鍵字名稱
[##_keyword_rep_desc_##],關鍵字描述
附註:獨立使用<s_keyword_rep>, </s_keyword_rep>會應用在 Keyword UI 這個插件啟用後的頁面。
看玩了 skin.html 之後,有頭暈腦脹的感覺吧。接著,不急著看 style.css,先來看看 index.xml 再做什麼。這個檔案是用來讓 TextCube 識別用的,也包含了樣板的作者資訊,樣板設定資訊等等。
詳細內容說明如下:
<?xml version="1.0" encoding="utf-8"?>
<skin>
<information>
<name>樣板名稱</name>
<version>版本編號</version>
<description>
<![CDATA[ 樣板描述 ]]>
</description>
<license>
<![CDATA[ 版權宣告]]>
</license>
</information>
<author>
<name>作者名稱</name>
<homepage>作者網站</homepage>
<email>作者 e-mail</email>
</author>
<default>
<recentEntries>最新文章顯示數目</recentEntries>
<recentComments>最新回應顯示數目</recentComments>
<recentTrackbacks>最新引用顯示數目</recentTrackbacks>
<itemsOnGuestbook>訪客留言每頁顯示筆數</itemsOnGuestbook>
<tagsInCloud>標籤顯示數目</tagsInCloud>
<sortInCloud>標籤排序方式(1, 2, 3)</sortInCloud>
<expandComment>是否展開回應(0 or 1)</expandComment>
<expandTrackback>是否展開引用(0 or 1)</expandTrackback>
<lengthOfRecentNotice>最新公告標題長度</lengthOfRecentNotice>
<lengthOfRecentEntry>最新文章標題長度</lengthOfRecentEntry>
<lengthOfRecentComment>最新回應內文長度</lengthOfRecentComment>
<lengthOfRecentTrackback>最新引用內文長度</lengthOfRecentTrackback>
<lengthOfLink>鏈結長度</lengthOfLink>
<showListOnCategory>分類頁面顯示清單(0 or 1)</showListOnCategory>
<showListOnArchive>日期歸檔頁面顯示清單(0 or 1)</showListOnArchive>
<commentMessage>
<none>沒有留言</none>
<single>有一則留言</single>
</commentMessage>
<trackbackMessage>
<none>沒有引用回覆</none>
<single>有一則引用回覆</single>
</trackbackMessage>
<tree>
<color>分類樹狀字體顏色(000000)</color>
<bgColor>分類樹狀背景顏色(ffffff)</bgColor>
<activeColor>當前分類樹狀字體顏色(000000)</activeColor>
<activeBgColor>當前分類樹狀背景顏色(eeeeee)</activeBgColor>
<labelLength>分類樹狀長度(27)</labelLength>
<showValue>是否展開分類樹狀(0 or 1)</showValue>
</tree>
<contentWidth>本文寬度</contentWidth>
</default>
</skin>
最後是 style.css,依照你的 skin.html 的設定來做,這是廢話。這裡提一下沒辦法在 skin.html 裡面控制的部分,特別是自動升成的日曆、分類清單以及鏈結清單等等。
內容就不多提了,直接看看官方說明吧。
分頁樣式
/* 已選擇的分頁樣式 */
.selected
{
text-align:center;
border-right:1px solid #ccc;
padding-right:10px;
margin-right:10px;
font-weight:bold;
color:#f30;
}
/* 沒有上一頁、下一頁樣式 */
.no-more-prev,
.no-more-next
{
color:#ccc;
}
文字標籤 (td 標籤)
.ib
{
cursor:pointer;
}
.branch3
{
cursor:pointer;
}
顯示數目
.c_cnt
{
font:0.75em Tahoma; color:#f30;
}
日曆設定
/* 月份 */
.cal_month
{
font-size:0.85em;
height:18px;
font-weight:bold;
}
/* 星期 */
.cal_week1
{
font:0.95em dotum;
height:18px;
font-weight:normal;
}
.cal_week2
{
font:0.95em dotum;
color:#f30;
}
a.cal_week
{
background-color:#fff;
}
.cal_current_week
{
background-color:#eee;
}
/* 日期 */
.cal_day
{
font-size:0.85em;
color:#999;
text-align:center;
}
.cal_day_sunday
{
color:#f30 !important;
}
.cal_day_sunday a
{
color:#f30 !important;
}
.cal_day1
{
color:#ccc;
}
.cal_day2
{
color:#ccc;
}
.cal_day3
{
color:#666;
}
.cal_day4
{
color:#000;
text-decoration:underline;
}
/* 鏈結樣式 */
a.cal_click:link { color:#333; font-weight:bold;}
a.cal_click:visited { color:#333; font-weight:bold;}
a.cal_click:hover { color:#f30; font-weight:bold;}
識別樣式 [##_rp_rep_class_##]
.rp_general {}
.rp_admin
{
background:url(images/iconAdmin.gif) no-repeat;
padding-left:20px;
}
.rp_secret
{
color:#f30;
font-weight:bold;
}
.hiddenComment
{
background:url(images/iconSecret.gif) no-repeat;
padding-left:20px;
font-weight:normal;
}
識別樣式 [##_guest_rep_class_##]
.guest_general {}
.guest_admin
{
background:url(images/iconAdmin.gif) no-repeat;
padding-left:20px;
}
.guest_secret
{
color:#f30;
font-weight:bold;
}
More/Less 樣式設定
.moreless_fold
{
background:url(images/iconMore.gif) top left no-repeat;
padding-left:20px;
color:#000;
}
.moreless_top
{
background:url(images/iconLess.gif) top left no-repeat;
padding-left:20px;
color:#000;
}
.moreless_Body {}
.moreless_bottom
{
background:url(images/iconLess.gif) top right no-repeat;
padding-right:20px;
color:#999;
text-align:right;
}
其它樣式
.cap1
{
color:#999;
text-align:center;
}
.imageblock {}
{
border:1px solid #ddd;
padding:5px;
margin:5px 0;
}
.left {}
.center {}
.right {}
.dual
{
background-color:#eee;
margin-bottom:5px;
}
.triple
{
background-color:#eee;
margin-bottom:5px;
}
聚合頁面官方提供樣式
/*-------------------------------*/
/* cover */
/*-------------------------------*/
.coverpost
{
clear: both;
border-bottom: 1px solid #ddd;
margin: 10px 0;
}
.coverpost h2
{
font-size: 120%;
padding-right: 5px;
}
.coverpost h2 a
{
letter-spacing: -1px;
line-height: 125%;
}
.coverpost .img_preview
{
background-color: #fff;
float: left;
padding: 0 7px 7px 0;
}
.coverpost .img_preview img
{
border: 2px solid #ccc;
cursor: pointer;
height: 80px;
width: 80px;
}
.coverpost .post_info
{
background-color: #faf9f8;
border-bottom: 1px solid #e8e8e8;
font: 0.9em Dotum, Arial, sans-serif;
padding: .3em .6em .3em 0;
}
.coverpost .post_info span
{
line-height: 1.2em;
padding: .3em 0 .3em 22px;
}
.coverpost .post_info .category
{
background: url('./images/bullet_folder.gif') no-repeat 6px 50%;
}
.coverpost .post_info .category a
{
color: #888;
margin-right: 6px;
}
.coverpost .post_info .date
{
background: url('./images/bullet_clock.gif') no-repeat 0 50%;
color: #888;
font-family: Verdana, Helvetica, Arial, Gulim, sans-serif;
padding-left: 16px;
}
.coverpost .post_info .author .preposition
{
display: none;
}
.coverpost .post_info .author
{
background: url('./images/bullet_author.gif') no-repeat 6px 50%;
}
.coverpost .post_content
{
margin: 5px 0;
line-height: 125%;
overflow: hidden;
}
.coverpost .post_tags
{
background: url('./images/bullet_tag.gif') no-repeat 0 0.35em;
clear: both;
line-height: 1.2em;
padding: 5px 5px 5px 20px;
}
.coverpost .post_tags a
{
font-size: 0.9em;
}
.coverpost .post_tags span
{
display: none;
}
關鍵字官方提供樣式
/*-------------------------------*/
/* keyword log */
/*-------------------------------*/
#keywords ul
{
list-type-style: none;
text-align: left;
}
#keywords ul li
{
display: inline;
line-height: 2.2em
list-type-style: none;
padding-right: 10px;
}
完畢,收工。
댓글을 달아 주세요