Dear Xuiters :
Xuite Blog"關於我"區塊的部份做了一些調整，為了讓使用自訂CSS樣式者可以清楚快速地進行調整，日誌小組整理了"關於我"區塊的CSS教學說明，供大家參考。
留言板功能簡介，請參考此篇 ~
Xuite Blog "關於我" 區塊 調整
(1)
若是使用系統預設面板,系統會由後端自動Update新增的CSS code部份， 譬如: 小嫻的日誌，沒有任何影响
(2).
若是使用自訂CSS樣板，那就會比較麻煩一點了，自訂 CSS的好處是提供了彈性客制化的自主權，但是，相對地對於新增CSS定義或調整時，需麻煩請各位手動自行調整新增CSS code
如何將黑點 ".暱稱 " 改成 => 右圖
分兩部份做修改 Part 1，Part 2 (參考以下說明)
先行預灠,確定無誤後，再儲存CSS檔.
Part 1
請先將以下code，複製到你的自訂CSS檔內，任何位置皆可
/*關於我分類---- 2006-5-12 Modify*/
.pTitle li{
list-style-image:url(http://s.blog.xuite.net/_image/bulletPersonal.gif);
}
.pTitle{
}
/*關於我欄位名稱---- 2006-5-12 Modify*/
.personaltitle{
padding:2px;
border: #500303 1px solid; /* 框線顏色，配合整體版面修改 */
background:;
font-weight:normal;
background-image:url(http://s.blog.xuite.net/_image/skin/windows/16/blog011_2.gif); /*底圖， 配合整體版面修改*/
color:#FFFFFF; /*系統自動帶出的暱稱 字體顏色，可自行修改 */
font-family:Verdana, Arial, Helvetica, sans-serif;
letter-spacing:0.1em;
font-size:15px;
margin-top:5px;
}
Part2
將以下新的.avatar code，複製到自訂CSS檔內，任何位置皆取代/*關於我 avatar*/ 的部分舊的 CSS code，或試情況修改
.avatar{ /* 2006-05-09 修改 */
background:#ffffff; /* 背景顏色，配合整體版面修改 */
border: #F6E294 1px solid; /* 框線顏色，配合整體版面修改 */
font-size:12px;
font-weight:normal;
line-height:140%;
font-family:Verdana, Arial, Helvetica, sans-serif;
padding:4px;
}
如何將黑點 "." 改成 => ">"
將以下code，複製到自訂CSS檔內，任何位置皆可
先行預灠,確定無誤後，再儲存CSS檔.
請先將以下code，複製到你的自訂CSS檔內，任何位置皆可
/*個人項目*/
.personallink{
display: block;
width:190px;
margin:0px 0px 0px 0px;
}
/*關於我*/
.plink ul{
list-style-type:none;
margin:0 0px;
padding:0px 2px 0px 20px;
word-wrap: break-word;
display: block;
float:left;
}
.plink li{
padding:0 0 0 0px;
margin:0px 0px 0px 0px;
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.plink{
padding:0 0 0 0px;
WIDTH: 90px;
}
/*我的相簿*/
.pphoto ul{
list-style-type:none;
margin:0 0px;
padding:0px 2px 0px 20px;
word-wrap: break-word;
display: block;
float:left;
}
.pphoto li{
padding:0 0 0 0px;
margin:0px 0px 0px 0px;
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.pphoto{
padding:0 0 0 0px;
WIDTH: 90px;
}
/*加入好友*/
.pfriend ul{
list-style-type:none;
margin:0 0px;
padding:0px 2px 0px 20px;
word-wrap: break-word;
display: block;
float:left;
}
.pfriend li{
padding:0 0 0 0px;
margin:0px 0px 0px 0px;
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.pfriend{
padding:0 0 0 0px;
WIDTH: 90px;
}
/*我的留言板*/
.pboard ul{
list-style-type:none;
margin:0 0px;
padding:0px 2px 0px 20px;
word-wrap: break-word;
display: block;
float:left;
}
.pboard li{
padding:0 0 0 0px;
margin:0px 0px 0px 0px;
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.pboard{
padding:0 0 0 0px;
WIDTH: 90px;
}
另外，有很多Xuiters詢問如何將不想顯示的個人連結隱藏問題，甜心做了以下整理，請參考以下教學，自行修改CSS樣式 .
別忘了先行預灠後，確定無誤，再儲存CSS檔.
不希望顯示 "我的相簿" 連結者,請參考以下語法,自行修改CSS樣式
/*我的相簿*/
.pphoto li{
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.pphoto{
display:none; /* 須隱藏者,請加上此段語法*/
}
"關於我" , "加入好友" , "我的留言板" 部份依此類推,請視個人需求調整.
/*關於我*/
.plink li{
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.plink{
display:none; /* 須隱藏者,請加上此段語法*/
}
/*加入好友*/
.pfriend li{
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.pfriend{
display:none; /* 須隱藏者,請加上此段語法*/
}
/*我的留言板*/
.pboard li{
list-style-image:url(http://s.blog.xuite.net/_image/blogIcon19.gif);
}
.pboard{
display:none; /* 須隱藏者,請加上此段語法*/
}
我的描述文字過長問題，請將以下code，複製到自訂CSS檔內
先行預灠,確定無誤後，再儲存CSS檔.
我的描述部份文字過長影响視覺時,可參考下列與法自行調整CSS樣式表.
/*我的描述*/
.avatarDesciption{
display:none; /* 須隱藏者,請加上此段語法*/
}
By 部落甜心
