Xuite CSS教學|Xuite CSS樣式分享

Xuite主要有七個區塊來做定位，即#container、標題(#banner)、頁尾(#footer)、中欄(#mid)、左欄(#linksLeft)、右欄(#linksRight)和內容(#content)。
中欄(#mid)佔據了整個頁寬，以padding屬性來決定左右欄最大寬度，由於左欄和右欄都是固定寬度，因此content的寬度會隨著瀏覽器改變。

一、各區塊名稱：

#banner

#content

#linksleft

#linksright

新版新增樣式：

#container	定位框
#linksLeft	左欄
#inksRight	右欄
#mid	中間欄
#footer	檔尾
.sidetitle	欄位名稱
.side	欄位內容
.blogemotion	今日心情
.menulist	選單列
.menu	選單
.logo	logo

.title	文章標題列
span.titlename	文章標題名稱
span.titledate	文章日期
.blogrank	文章評價例
span.counter	文章瀏覽數
span.counter li	文章瀏覽數項目符號
span.category	文章分類
span.category li	文章分類項目符號
.blogbody	文章主體
.posted	作者列
.selectbar	上下文章
.trackbacktitle	引用列
.trackbacktitle li	引用列項目符號
trackbackurl	引用網址
.trackbackdate	引用日期
.trackbackcontent	引用內容
.comment	留言列
span.commenttitle	留言名稱
span.commenttitle li	留言名稱項目符號
span.commentbutton	留言按鈕
.author	留言作者列
span.authorname	留言作者名稱
span.commentdate	留言日期
commenttext	留言內容
.commentedit	留言編輯按鈕
span.email	留言者信箱

左欄class

關於我

.avatarPhoto	照片
.avatarDesciption	描述
.avatarbutton	關於我按鈕

文章分類

.categoryTitle li
.categorySide li
.categoryTitle
.castgorySide

日曆

.calenderTitle li
.calenderTitle
.calenderSide
.calMonth	日曆table
.calMonthNay	日曆首列
.calMonthBackward	日曆上個月
.calMonthCurrent	日曆目前顯示年月
.calMonthForward	日曆下個月
.calMonthHeader	日曆星期列
.calMonthDay	日曆日欄
.calMonthToday	日曆今日日期
.calholiday	日曆假日日期
.calenderbutton

搜尋文章

.searchTitle li
.searchTitle
.searchSide
.searchbutton

我的哈拉室

.chatTitle li
.chatTitle
.chatSide

已建立的日誌

.bloglistTitle li
.bloglistTitle
.bloglistSide

訂閱電子報

.epaperTitle li
.epaperTitle
.epaperSide
.epaperbutton

自由欄位

.customTitle li
.customTitle
.customSide

日誌使用資源

.resourceTitle li
.resourceTitle
.resourceSide

留言塗鴉版

.paintTitle li
.paintTitle
.paintSide

右欄class

背景音樂

.musicTitle li
.musicTitle
.musicSide
.musicbutton

最新文章

.articleTitle li
.articleTitle
.articleSide

最新留言

.messageTitle li
.messageTitle
.messageSide
.date

參觀人次統計

.countTitle li
.countTitle
.countSide

我的訂閱

.rssrollTitle li
.rssrollTitle
.rssrollSide
.backbtn
.morebtn

日誌評價

.rankTitle li
.rankTitle
.rankSide

已建立的相簿

.albumTitle li
.albumTitle
.albumSide

最愛連結

.linkTitle li
.linkTitle
.linkSide

如有實作上的問題...可參考...

"布拉格的羅傑"網站:

Xuite CSS教學