css - 帳號面板

本文引用自此
本文引用自此

原來這邊才是大學問!!
原本想說既然不能掀屋頂..
那改這裡好像沒什麼差別..
一直都沒去學XD..




這次是改這邊↓,以下只是換底色!!!簡單版..(不包含滑鼠移入移出變色)
上面那排綠色的(寫勇者小屋的底色)不能換掉喔!!

以下請複製貼上
/*--------------------上方勇者小屋---------------------*/
/*ID的字體顏色*/
.wide_password2{color:gray;}

/*---信箱銀行和勇造VIP中間那條線---*/
.wide_line{
border-top:1px dashed #000;
background-color:blue;}/*勇造VIP旁邊的箭頭底色*/

/*----帳號面板的文字---*/
.wide_sev{
background-color:red;}/*信箱銀行勇造VIP的底色*/

/*---我要註冊+等級---*/
.wide_sign{color:orange;/*等級的字體顏色*/
background-color:green;}/*等級的底色*/

/*-------帳號面板背景顏色底圖設定-------*/
.wide_wordbk7{
background-color:yellow;/*黃色底色*/
border:5px solid pink;/*外框那一圈粗粉紅色*/
}/*剩下的底色*/



以下是複雜版+換底圖,包含..『滑鼠移入移出』文字會變色(上面請刪除!!)


/*--------------------上方勇者小屋---------------------*/
/*ID的字體顏色*/
.wide_password2{color:gray;}

/*---信箱銀行和勇造VIP中間那條線---*/
.wide_line{
border-top:1px dashed #000;
background:transparent;}/*勇造VIP旁邊的箭頭底色*/


/*----帳號面板的文字---*/
.wide_sev{
background:transparent;/*信箱銀行勇造VIP的底色*/
text-decoration: none; color: #000;}
.wide_sev a:link,.wide_sev a:visited {
text-decoration: none; color: #000;}
.wide_sev a:hover,.wide_sev a:active {
text-decoration: none; color: #000;}

/*---我要註冊+等級---*/
.wide_sign{
font-size:12px;
text-decoration: none;
color: #000;/*等級的字體顏色*/
background:transparent;}/*等級的底色*/
.wide_sign a:link,.wide_sign a:visited {
font-size:12px;
text-decoration: none;
color: orange; }
.wide_sign a:hover,.wide_sign a:active {
font-size:12px;
text-decoration: none;
color: deepink;}

/*----帳號面板背景顏色設定----*/
.wide_wordbk7{
background-image: url(http://圖片網址);
padding-bottom:0px;
padding-top:0px;
border:0px solid pink;
}/*剩下的底色*/

/*隱藏勇造+登出*/
.wide_wordbk7 img {visibility:hidden;}


/*隱藏勇造+登出*/
.wide_wordbk7 img {visibility:hidden;}
隱藏後↓


/*顯示勇造+登出*/
如果你有寫去屋頂的語法，
想要顯示圖片+登入登出
.wide_wordbk7 img {visibility:visible;}



如果你的圖片太大~超過68px
可以設定這裡↓,的數字
padding-bottom:0px;
padding-top:0px;

以下是舉例..
我是用這張圖~(就是上下兩條虛線啦=口=)

因為他蠻高的!!
所以..我放上去的時候變這樣↓




後來我設定都8px,上下加高了!!變這樣↓




最後設定padding-bottom:13px; 變這樣↓



其實也可以設定height: 110px;
但是可能不能變成13px的那種效果@@? 懶的測試了..(毆

左右的距離不能使它變寬..
只能讓文字整個向右邊移動..




以上引用自淵(houup)-小屋另類修改教學
淵(houup)-小屋另類修改教學 - 進階篇
還有參考.. 雛路[窮到被鬼抓屁股](hinaro) 所提供的佈景..