目前分類:語法學習 (237)

瀏覽方式: 標題列表 簡短摘要


  常常有部落格新人問我怎樣修改版面,這些是常用的 css語法,我整理出來,讓大家參考。我沒有提供幫訪客設計版面的服務,甚歉。其實,修改版面並不難,請大家自己打造個人風格的版面,當您自己修改完成時,心中的快樂是很難形容的。加油喔~~


   怎樣修改呢?css在哪裡呢?
1.將所選用的圖片網址,加到語法中
2.你的大頭貼下方 【編輯個人檔案】→ 【面板設定】→【自訂樣式】
3.將語法貼到自訂樣式(css語法)中,就行了...


 


/*blog profile 部落格檔案、個人資料、自我介紹加圖片*/
table#bloginfo th {background:url(部落格檔案標題圖片的網址);}
table#bloginfo td {background:url(部落格檔案敘述圖片的網址);}
table#usrinfo th {background:url(個人資料標題圖片的網址);}
table#usrinfo td {background:url(個人資料敘述圖片的網址);}
#yusrintro p {background:url(自我介紹圖片的網址);}


 


/*自訂欄位寬度三欄式*左欄寬150右欄寬200*/
.thrcol .yc3main {width:100%;float:left; margin-left:-210px;}
.thrcol .yc3mainbd {margin-left:210px;}
.thrcol .yc3pri {width:100%;float:right;margin-right:-160px;}
.thrcol .yc3pribd {margin-right:160px;}
.thrcol .yc3subbd {width:200px;float:right;}
.thrcol .yc3sec {width:150px;}
.thrcol .yc3sub{z-index:1;}
.thrcol .yc3pri,.thrcol .yc3main{z-index:10;}


  每個人版型設定不同。(使用二欄式或三欄式)



/*two col layout 二欄式版面加大寬度設定*/
.twocolga #yhtw_mastfoot, .twocoldr #yhtw_mastfoot {width:950px;margin:0 auto;}
.twocolga[class], .twocoldr[class]{min-width:950px;behavior:none;}
.twocolga .ycnt3col,.twocoldr .ycnt3col {zoom:1;width:950px;text-align:left;margin:0 auto;}


/*三欄式版面寬度設定*/


.thrcol #yhtw_mastfoot {width:950x;margin:0 auto;}
.thrcol[class]{min-width:950px;behavior:none;}
.thrcol .ycnt3col {zoom:1;width:950px;text-align:left;margin:0 auto;}


             如果您要更改自訂欄位的寬度,詳細內容請閱讀怎樣加寬自訂欄位?


 


/*自訂欄位連結列自動加框*/
.ycntmod .mbd ul.list li {BACKGROUND: url(底圖網址 ) 0% 100%; COLOR:white; border:5px;  BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;}


 外框的樣式有8種,可更改顏色、粗細、距離,詳細說明請閱讀自動加框


 


/*make coomment bar回應引用更換圖片*/
div.btncomment a {display:block;height:高px;width:寬px;background:url(我要回應圖片網址) no-repeat;}
div.btntrackback a {display:block;height:高px;width:寬px;background:url(我要引用圖片網址) no-repeat;}


 


/*comment list management管理回應欄*/
.listbd {background:url(管理回應底圖網址); color:#文字顏色之色碼;}
#ycmntlist table th {background: url(管理回應標題圖網址); color: #文字顏色之色碼; }
#ycmntlist .btncmntre {background:url(管理回應按鈕圖網址);}


 


/*guestbook留言版加圖片*/


#ymsgboard q a {background:url(留言板按鈕圖網址) ;}
#ymsgboard .mhd {background:url(留言板標題圖網址) ;}
#ymsgboard .mbd {background:url(留言板底圖網址) ;}


 


/*Article隱藏文章寬欄位*/
.yc3pribd .mhd{display:none}
.yc3pribd .mbd{zoom:1;filter:alpha(opacity:底圖透明度)}


/*Blog category list module隱藏左右欄位標題*/
.yc3sec .mhd,.yc3sub .mhd{display:none}
.yc3sec .mbd,.yc3sub .mbd{zoom:1;filter:alpha(opacity:底圖透明度)}


/*Blog album module隱藏部落格相簿*/
#ymodalbum{display:none;}


/*隱藏留言板*/
#ymodmsgbd h3{display:none}


/*Blog latest update module隱藏更新日期*/
#ymodupdate{display:none}


/*Profile隱藏自我介紹欄*/
#ymodprf{display:none}


/* 隱藏頁首和頁尾*/
#yhtw_masthead,#yhtw_mastfoot{display:none;}


/* 隱藏整個部落格*/


body{background-image:url(背景圖網址); background-attachment:fixed;}
.ycntmod { filter:alpha(opacity:0); }


 隱藏整個部落格的語法 ,使用 Firefox 火狐瀏覽器無法隱藏...IE瀏覽器才可以隱藏部落格  。如果您是使用Firefox 火狐瀏覽器,詳細語法請閱讀隱藏部落格


 


/*Links連結去底線*/
a,a:link,a:visited{color:#未連結時色碼;text-decoration: none}
a:hover{color:#連結時色碼;text-decoration: none;}


/*Links網頁超連結虛線框*/
a,a:link,a:visited{color:#色碼;text-decoration:none}
a:hover{color:# 色碼;background-image:url(http://圖檔網址.gif);background- repeat:repeat;border:1px dotted #色碼;position:relative;top:1px;left:1px}


/*Links連結浮出效果*/
a:hover{ border: 2px #fff outset }


 


/*Background背景圖底圖重複*/
body{background:#ffffff url(背景圖網址) repeat;}


/*Background背景圖底圖固定*/
body{ background:#ffffff url(背景圖網址) no-repeat;background-attachment: fixed}


/*部落格標題圖*/
#yblogtitle h1 { display:block; float:left; background:url(標題圖網址)no-repeat; width:圖片寬度px;  height:圖片高度px; font-size:0; line-height:0; text-indent:-5000px; overflow:hidden; cursor:pointer;  cursor:hand;}


/*Blog title標題置中*/
#yblogtitle .mbd,#yblogtitle .mft{font-size:180%;color:#色碼;font-family:新細明體; color:#D23C78;text-align:center;}
#yblogtitle .thd a{width:168px;height:40px;top:-0px;position:relative;left:0px;display:block;}
#yblogtitle .thd h1 {font-size:180%;color:white;font-family:新細明體;}


/*Module latest upup更新日期前小圖*/
#ymodupdate .mbd .date{background:url(小圖網址) left center no-repeat;padding-left:11px;font-size:104%;font-family:verdana;}


/*Nav module list左右欄位小圖*/
.ycntmod .mbd ul.list li {background:url(小圖網址1) left .1em no-repeat;padding-left:25px;margin-bottom:3px;_margin-bottom:3px;_line-height:1.5em;}
.ycntmod .mbd ul.list li.more {margin:-3px 0 0 -3px;text-align:right;background:url(小圖網址2) 20px center no-repeat;}


/*Article content module文章前小圖*/
.yblogcnt .blgtitlebar {margin-bottom:9px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:125%;font-weight:bold;background:url(小圖網址) no-repeat;padding-left:60px;}



/*btnsbsrb訂閱部落格圖*此語法自己看不見訂閱圖/
div#btnsbsrb a{display:block;width:圖片寬度px;height:圖片高度px;overflow:hidden;background:url(訂閱圖網址) no-repeat;margin:0;}
div#btnsbsrb_nologin a{display:block;width:圖片寬度px;height:圖片高度px;overflow:hidden;background:url(訂閱圖網址) no-repeat;margin:0;}
#yblogtitle .tft {text-align:right;padding-bottom:0px;position:relative;}


 


/*btnsbsrb訂閱部落格圖*此語法自己可以看見訂閱圖/
 div#btnsbsrb_nologin a,div#btnsbsrb a {display:block;position:absolute;top:10px;left:91%; width:90px;height:33px;background:url(訂閱圖網址) no-repeat;}


/*性別圖*/
#ymodprf .horos img{display:none;}
#ymodprf .horos{width:圖片寬度px;height:圖片高度px;background:url(性別圖網址) center no-repeat;}


/*滑鼠游標*/
body{cursor:url(未連結時游標網址)}
a:hover {cursor:url(連結時游標網址)}


/*Opacity for blast招呼語圖框+文字置中*/
#yblast{zoom:1;position:relative;top:-20px;left:0px;margin:0 0 -55px 0;z-index:2;}
#yblast .text,#yblast .bg{overflow:hidden;padding:5px 5px;width:招呼語圖框寬px;height:招呼語圖框高px;}#yblast .text{zoom:1;margin:-55px 0 0;}
#yblast .text a#yblast a.edit{background:url(圖框網址);width:13px;height:13px;}
#yblast .bg {zoom:1; filter:alpha(opacity:透明度); background: url(圖框網址) no-repeat}
#yblast .text{color:#文字顏色之色碼;font-size:90%;}


 


/*shared rounded corner for all modules無框線語法*/
.ycntmod {width:100%;position:relative;margin-bottom:10px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:url() left top no-repeat;margin-right:5px;}
.ycntmod .rctop div {background:url() right top no-repeat;height:5px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcbtm {zoom:1;background:url() left bottom no-repeat;margin-right:5px;}
.ycntmod .rcbtm div {background:url() right bottom no-repeat;height:5px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcl {padding-left:5px;background:url() repeat-y;}.ycntmod .rcr {zoom:1;padding-right:5px;background:url() right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}



/*部落格單色外框線*/
body {border: 框線大小px double #大框線色碼 ;}


/*部落格漸層外框線*/
html{border-top : 大小px solid #色碼; border-bottom : 大小px solid #色碼; border-left : 大小px solid #色碼; border-right : 大小px solid #色碼; }


/*按鈕框框*/
input,select{background: #框底色碼;color: #文字色碼;border: 1px solid #框線色碼;FONT-SIZE: 9px;font-family:verdana;}


 



/*Text color for module左右欄位標題文字顏色*/
.text {color: #文字顏色之色碼}


/*Text color for blog title部落格標題字體顏色*/
#yblogtitle .text {color: #文字顏色之色碼}


/*Text color for blog title部落格敘述文字*/
#yblogtitle .text {color:#文字顏色之色碼;}


/*Text color for main content中間文章欄位文字顏色*/
.yc3pribd .text {color: #文字顏色之色碼}


 


/*Nav module body左右欄位底圖*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background-image:url(底圖網址);}


/*Nav module header左右欄標題底圖*/
.yc3sec .mhd, .yc3subbd .mhd, .yc3sec .mhd a, .yc3subbd .mhd a,.yc3sec .mhd a:link, .yc3subbd .mhd a:link,.yc3sec .mhd a:visited, .yc3subbd .mhd a:visited{background-image : url(底圖網址);}


/*Blog title部落格標題敘述欄底圖*/
#yblogtitle .mbd,#yblogtitle .mft{background: url(底圖網址) repeat; }#yblogtitle h1{color: #000000 ;}


/*Main content body文章底圖*/
.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p{
background-image:url(底圖網址);color: #FF0099} #ymodcal .mbd td strong {color: #FF0099;}


/*Main content header文章標題底圖*/
.yc3pribd .mhd{ background:url(圖片網址) repeat; color:#FF0099}


 


/*Background color for whole page背景底色*/
body {background-color: #色碼}


/*Background color for blog title部落格敘述底色*/
#yblogtitle .mbd, #blogtitle .mft {background-color: #色碼}


/*Background color for module左右欄位內容底色*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft {zoom:1; background: #色碼; filter:alpha(opacity:透明度)}


/*Nav module header左右欄位標題底色*/
.yc3sec .mhd, .yc3subbd .mhd{background: #色碼;color: #色碼;}


 


/*Opacity for main content文章底圖透明度*/
.yc3pribd .rctop,.yc3pribd .rctop div,.yc3pribd .rcl,.yc3pribd .rcr,.yc3pribd .rcbtm,.yc3pribd .rcbtm div {zoom:1; filter:alpha(opacity:透明度)}
#yblast{display}


/*Opacity for sub column左右欄位透明度*/
.yc3subbd .rctop,.yc3subbd .rctop div,.yc3subbd .rcl,.yc3subbd .rcr,.yc3subbd .rcbtm,.yc3subbd .rcbtm div, .yc3sec .rctop,.yc3sec .rctop div,.yc3sec .rcl,.yc3sec .rcr,.yc3sec .rcbtm,.yc3sec .rcbtm div {zoom:1; filter:alpha(opacity:透明度)}


/*Opacity for blogtitle部落格標題敘述透明度*/
#yblogtitle .rctop, #blogtitle .rctop div, #yblogtitle .rcl, #yblogtitle .rcr, #yblogtitle .rcbtm, #yblogtitle .rcbtm div {zoom:1; filter:alpha(opacity:透明度)}


  如果您是使用Firefox 瀏覽器,會發現版面的透明度無效。這時只要在每個想要呈現透明的部分,使用這語法 background:url( ) ,詳細說明請閱讀使用Firefox 瀏覽器時的透明版面


 


/*捲軸變色*/


html{
SCROLLBAR-FACE-COLOR: 色碼;                     /*設定軸面顏色*/
SCROLLBAR-HIGHLIGHT-COLOR:色碼;              /*設定軸面三角左邊顏色*/
SCROLLBAR-SHADOW-COLOR: 色碼;               /*設定軸面三角右邊顏色*/
SCROLLBAR-3DLIGHT-COLOR: 色碼;                 /*設定左立體邊顏色*/
SCROLLBAR-DARKSHADOW-COLOR: 色碼;      /*設定右立體面顏色*/ 
SCROLLBAR-ARROW-COLOR: 色碼;                 /*設定箭頭的顏色*/
SCROLLBAR-TRACK-COLOR: 色碼;                   /*設定軸軌的顏色*/
}


捲軸顏色產生器   色碼表  色碼選擇器  框線圖加框語法


 


/*Shared rounded corner for all modules框線圖*/
.ycntmod {width:100%;position:relative;margin-bottom:10px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:url(左彎上邊框圖網址) left top no-repeat;margin-right:5px;}
.ycntmod .rctop div {background:url(右上彎角圖網址) right top no-repeat;height:5px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcbtm {zoom:1;background:url(左彎下框邊圖網址) left bottom no-repeat;margin-right:5px;}
.ycntmod .rcbtm div {background:url(右下彎角圖網址) right bottom no-repeat;height:5px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcl {padding-left:5px;background:url(左側直邊框圖網址) repeat-y;}
.ycntmod .rcr {zoom:1;padding-right:5px;background:url(右側直邊框圖網址) right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}


希望這些內容,能對您有所幫助,加油喔~~


.


.


.


.


《 晨曦乍現 公告 》


除非你的年紀比我大!!!否則請不要叫我幫你修改版面~~(帥哥不在此限內...)


引用:http://tw.myblog.yahoo.com/jw!LRpTR2iHQU7nnybZhqiOk2s-/article?mid=27394




常用自訂語法-整理Ⅱ



每個語法使用者設定不一,以下為參考語法,不當的設定或許與使用者目前使用的自訂內容會產生干擾,請小心慎選使用。


語法依照中文意思排列(語法請做選擇性使用,不可全部套上)。


所有數據只是參考值,需要配合需求程度調整,邊框線部份不需要的,語法可以直接刪除。


不存在的網址連結及多餘的重複語法,會影響正常的視窗開啟速度。


注意空格及每段語法連慣性,避免開啟動作不正常。


無設定的相關語法,以yahoo預設值為設定值。


背景預設顏色的作用: 圖片失聯時,以背景色替代,顏色要謹慎設定。


部份透明度設定因YAHOO新版語法規定失效,請自行測試。


/*個人資料管理頁面公開的部落標題-個人資料-自我介紹+背景圖-背景預設顏色-文字顏色-字型字體大小使用預設值*/
#ybloginfo table, #yusrinfo table, #yusrintro p {background: url(圖片網址) #E6E6E6;color:#FF0000;}

/*整頁背景位置調整,x與y軸的位置(適用於1000X600像素以下之圖片)*/
body {background-position : 50% 0%; }


/*整頁背景預設顏色-背景圖 - 背景圖不重複 - 背景固定*/
body {background:#1B006B;background-image: url(圖片網址);background-repeat:no-repeat;background-attachment:fixed;}


/*取消兩欄式下方捲軸*/
body {overflow-x:hidden;}


/*整頁背景圖簡語*/
body {background: url(圖片網址) #1B006B no-repeat;background-position : 50% 0%;background-attachment:fixed;overflow-x:hidden;}


/*圖片重複方向定義解說 : repeat-x = 橫向排列,適用垂直條形圖; repeat-y = 縱向排列,適用水平條形圖; repeat = x-y軸同時排列,適用方形圖; no-repeat = 單張圖片不重複,適用與架框同等長寬的圖片*/


/*回應 - 引用+邊框 線*/
div.btncomment a {border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}
div.btntrackback a {border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}


/*我要回應小圖-連結區塊-height:60px-width:60px為圖框大小*/
div.btncomment a {display:block;height:60px;width:60px;background:url(小圖網址) no-repeat;}
/*我要引用小圖-連結區塊-height:60px-width:60px為圖框大小*/
div.btntrackback a {display:block;height:60px;width:60px;background:url(小圖網址) no-repeat;}


-------感應滑鼠回應引用圖--------


/*回應圖*/
div.btncomment a {display:block;height:32px;width:62px;background:url(圖片網址) no-repeat;}


/*滑鼠指標靠近改變回應圖*/
div.btncomment a:hover {display:block;height:35px;width:80px;background:url(圖片網址) no-repeat;}


/*引用圖*/
div.btntrackback a {display:block;height:32px;width:62px;background:url(圖片網址) no-repeat;}


/*滑鼠指標靠近改變引用圖*/
div.btntrackback a:hover {display:block;height:35px;width:80px;background:url(圖片網址) no-repeat;}


/*訂閱自訂圖示-連結區塊-改變圖示位置四邊不同值順序為上、右、下、左+邊框線(格主需在登出的狀態下才看得到訂閱圖)*/
div#btnsbsrb_nologin a,div#btnsbsrb a {display:block;background: url(圖片網址); margin:100pt 0pt 0pt 0pt; border-left:8px double #FF0000; border-right:8px double #FF0000; border-top:8px double #FF0000; border-bottom:8px double #FF0000;}


-------感應滑鼠訂閱圖--------


/*訂閱圖-連結區塊-訂閱圖位置-訂閱圖顯示寬高-訂閱圖網址 - 框線*/
div#btnsbsrb_nologin a,div#btnsbsrb a{display:block;position:absolute;top:-110px;left:91%; width:90px;height:33px;background:url(訂閱圖網址) no-repeat; border-left:4px double #FF0000; border-right:4px double #FF0000; border-top:4px double #FF0000; border-bottom:4px double #FF0000; }


/*滑鼠指標靠近改變訂閱圖 - 框線*/
div#btnsbsrb_nologin a:hover,div#btnsbsrb a:hover,div#btnsbsrb_nologin a:active,div#btnsbsrb a:active {background:url(答謝訂閱圖網址) no-repeat;border-left:4px double #00FFFF; border-right:4px double #00FFFF; border-top:4px double #00FFFF; border-bottom:4px double #00FFFF;}


/*自訂留言板按鈕圖片*/
#ymodmsgbd h3 a {display:block;background:url( 圖片網址 ) no-repeat;width:130px;height:130px;text-indent:-300px;}


/*自訂部落格相簿按紐圖片*/
#ymodalbum h3 a {display:block;background:url( 圖片網址 ) no-repeat;width:130px;height:130px;text-indent:-300px;}


/*-----↓標題欄-注意語法設定重複衝突干擾 -----*/


/*標題背景圖應用:如果單張大圖不重複圖片時,需在(圖片網址) #0000bf後空一格加入 no-repeat center 例如 : #yblogtitle h1{background: url(圖片網址) #0000bf no-repeat center; color: #FF0000; font-family:標楷體; FONT-SIZE:26pt; font-weight:bold;}*/


/*標題背景圖位置應用: center=置中,left=左邊,right=右邊,top=上面,bottom=下面,no-repeat=不重複,repeat-x=橫向重複 ,repeat-y=縱向重複,組合範例: no-repeat center */


/*隱藏標題(包括訂閱)*/
#yblogtitle {display:none}


/*隱藏標題所有文字(包括自訂格名)-適合應用加在格式二,最好配合訂閱圖示位置調整*/
#yblogtitle .text {display:none}


/*隱藏格名語法*/
#yblogtitle a {display:none;}


/*獨立設定自訂格名文字顏色-字型-字體大小(不受 .text 文字語法設定影響)*/
#yblogtitle h1, #yblogtitle a {color: #00FF00; font-family:標楷體; FONT-SIZE:30px;}


/*以下部落格自訂格名與描述-必須配合透明度使用-套用格式四選一(勿混用,會產生錯誤)*/


/*部落格自訂格名與描述-格式一(置頂框線在訂閱圖之上)*/


/*部落格自訂格名與描述 - 文字置中*/
#yblogtitle .mbd{text-align:center;}


/*部落格自訂格名+背景圖-背景預設顏色 - 字體顏色 - 字型 - 字體大小 - 粗體字*/
#yblogtitle h1{background: url(圖片網址) #0000bf; color: #FF0000; font-family:標楷體; FONT-SIZE:26px; font-weight:bold;}


/*部落格描述+背景圖-背景預設顏色-背景高度+邊框 線*/
#yblogtitle .text {background: url(圖片網址) #0000bf; height:200px; border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}


/*部落格描述字體顏色 - 字型 - 字體大小*/
#yblogtitle .text {color:#ff7f00; font-family:標楷體; FONT-SIZE:20px;}


/*部落格自訂格名與描述-格式二(置頂框線在訂閱圖之外)*/


/*部落格自訂格名與描述 - 文字置中-字體大小*/
#yblogtitle .mbd {text-align:center; font-size:20px;}


/*部落格自訂格名+背景圖-背景預設顏色-字體顏色-字型-粗體*/
#yblogtitle h1 {background: url(圖片網址) #80c0ff; color:#FF0000;font-family:標楷體; font-weight:bold;}


/*部落格描述+背景圖-背景預設顏色-背景高度+邊框 線*/
#yblogtitle .mbd {background: url(圖片網址) #0000bf; height:200px; border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}


/*部落格描述-字體顏色 - 字型*/
#yblogtitle .text {color:#ff7f00; font-family:標楷體;}


/*部落格自訂格名圖片與描述-格式三(部落格名以圖片取代)*/


/*隱藏設定小方圖*/
#yblogtitle .edit {display:none;}


/*部落格名標題圖置中*/
#yblogtitle .thd {text-align:center; }


/*部落格描述-字型-字體顏色 - 字體大小-文字靠左-文字顯示範圍寬高-絕對位置-文字位置*/
#yblogtitle .tbd {font-family:標楷體; color:#00007f;font-size:150%;text-align:left;width:90%;height:205px;position:relative;top:85px;left:5px;}


/*部落格名圖-連結區塊-圖片置中-圖框寬高(配合圖片大小)-部落格名字體大小為0-文字排縮(目的為移出顯示作用)*/
#yblogtitle .thd a {display:block;background:url(格名圖網址) center no-repeat;display:block;width:100px;height:100px;font-size:0;text-indent:-5000px;}


/*部落格描述背景圖-背景預設顏色-小圖重複*/
#yblogtitle .mbd {background: url(圖片網址) #8080ff repeat;}


/*部落格自訂格名圖片與隱藏描述-格式四(部落格名以圖片取代)*/
#yblogtitle .edit {display:none;}
#yblogtitle .mbd{text-align:center}
#yblogtitle .mbd .tbd{display:none}
#yblogtitle .rctop,#yblogtitle .rctop div,#yblogtitle .rcl,#yblogtitle .rcr,#yblogtitle .rcbtm,#yblogtitle .rcbtm div{zoom:1;filter:alpha(opacity:0)}
#yblogtitle .thd h1 {display:block;background:url(格名圖網址) center no-repeat;display:block;float:center;width:430px;height:120px;font-size:0;text-indent:-5000px;}


/*滑鼠自動變換含超連結字體變換顏色-連結初始字體顏色-去除連結底線+連結位置相對自動加彩色邊框 線*/
/*附記 : 左右欄框分目錄連結,字體顏色在此會 受到影響*/
body{cursor:url(小圖網址)}
a:hover{cursor:url(小圖網址);color:#00ffff;}
a,a:link,a:visited{color:#ffffff;text-decoration: none}
a:hover {position: relative; border-left:3px ridge #00ffff; border-right:3px ridge #ffff00; border-top:3px ridge #00ff80; border-bottom:3px ridge #ff00ff;}

/*左右欄框分類標題 -框與框的間距+邊框 線*/
.ycntmod .mbd ul.list li {margin-bottom:7px; border-left:3px ridge #00ffff; border-right:3px ridge #ffff00; border-top:3px ridge #00ff80; border-bottom:3px ridge #ff00ff;}


/*左右欄框分類標題 -標題小圖-不重複 - 小圖與文字間隙*/
.ycntmod .mbd ul.list li {background:url(小圖網址) 3% 10% no-repeat;padding-left:15px;}


/*左右欄位加底&透明度*/
.yc3subbd, .yc3sec {border:3px double #FBD3D5;margin-bottom:5px;background:#FFEFEC;filter:alpha(opacity=60);opacity:0.60;}


/*文章標題小圖-不重複 - 小圖與文字間隙 - 小圖與文字位置*/
.yblogcnt .blgtitlebar h2 {background:url(小圖網址) no-repeat;padding-left:15px;}
.yblogcnt .blgtitlebar {margin-bottom:10px;zoom:1;}


/*文章標題字體-顏色-字型-大小-粗體*/
.yblogcnt .blgtitlebar h2 {color:#FF0000;font-family:標楷體;font-size:22px;font-weight:bold;}


/*文章欄位字體顏色 - 字型 - 字體大小*/
.yc3pribd .text {color: #AFEEEE;font-family:新細明體;font-size:125%;}


/*所有預設整體字體-顏色-字型-大小(其它架框項目無設定時,在此可能影響)*/
.text {color:#FFFF00; font-family:新細明體; font-size:115%;}


或是 ↓↑


/*全版預設整體字體-顏色-字型-大小(其它架框項目無設定時,在此可能影響)*/
BODY {color:#FFFF00;Font-Family: 新細明體;Font-Size:115%;}


/*欄位名稱標題字體顏色-字型-字體大小-粗體-欄位寬高*/
#ymodmsgbd .mhd h3, .ycntmod .mhd h3, .ymsgboard .mhd h3 {color:#FF0000;font-family:標楷體;font-size:22px;font- weight:bold;width:123px;height:35px;}


/*欄位名稱標題+背景圖(建議用橫形圖)-圖片左右位置-不重複-文字位置 - (此語法建議用在不透明樣式)*/
#ymodmsgbd .mhd h3, .ycntmod .mhd h3, .ymsgboard .mhd h3 {background: url(圖片網址) 50% no-repeat;padding-left:15px;padding-top:15px;}


/*欄位名稱標題背景顏色(當使用欄位名稱標題透明背景圖時,背景顏色跟著一起呈現)*/
.yc3sec .mhd,.yc3sub .mhd{background:#FF0000}


/*個性圖 - 圖框大小-不重複+邊框 線*/
#ymodprf .horos{width:129px;height:129px;background:url(圖片網址) no-repeat center; border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}


/*隱藏窄欄框上的"上傳個人相片"及"編輯個人檔案"按鈕*/
#ymodprf .btneditprf a {display:none;}
#ymodprf .btnulprfphoto a {display:none;}


/*改變性別圖上方的星座文字-置左-字體-文字大小-文字顏色*/
#ymodprf .horos{text-align:left; font-family:新細明體; font-size:14px; color:#FF0000;}


/*改變暱稱字體-文字大小*/
#ymodprf .nickname a {font-family:標楷體;font-size:28px;}


/*月曆-字體基本顏色-字體大小+背景圖-背景預設顏色+邊框*/
#ymodcal table {color:#FF0000; font-size:100%; background: url(圖片網址) #000000; border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}


/*整欄月曆襯底背景圖(建議使用單色系)*/
#ymodcal {background: url(圖片網址) repeat;}


/*月曆-連結日期字體顏色+醒目框線*/
#ymodcal table a {color:#00ffff; border-left:1px solid #ff0000; border-right:1px solid #ff0000; border-top:1px solid #ff0000; border-bottom:1px solid #ff0000;}


/*月曆-年月連結字體顏色-字體大小(上年-下月)(注意 : 如果使用了連結自動加框線語法,建議使用目前語法中的字體大小)*/
#ymodcal a {color:#00ff80;} /*←年份三角翻查符號顏色*/
#ymodcal .selyr {color:#ffff00;font-size:80%;}
#ymodcal .selmn a {color:#ff00ff;font-size:70%;}


/*月曆-年月背景小圖(上年-下月)*/
#ymodcal .selyr {background: url(背景小圖) no-repeat;width:50px;height:25px;text-align:center;}
#ymodcal .selmn {background: url(背景小圖) no-repeat;width:70px;height:25px;text-align:center;}


/* 月曆上今天日期的字體顏色及大小 */
#ymodcal .mbd td strong {color:#FFFF00; font-size:115%;}


/* 月曆星期的字體顏色 */
#ymodcal th {color:#00ff80;}


/*附記:如果因為使用了圖片式欄位邊框,而影響月曆的年月不能顯示,可利用↓做修正*/
#ymodcal .selyr, #ymodcal .selmn a {width:60px;font-size:100%;;margin-left:-5px;}


/*招呼語隱藏"我要留言"字樣(招呼語有連結作用時,此語法不能使用)*/
#yblast .text a{display:none;}


/*招呼語+邊框線*/
#yblast .bg {border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;}


/*招呼語-自訂背景圖,底圖圖如果與字寬同寬時,可設 no-repeat (圖片網址空白即透明)*/
#yblast .bg {background: url(圖片網址) repeat;}


/*Opacity for blast招呼語透明度*/
#yblast .bg {zoom:1; filter:alpha(opacity:100)}


/*招呼語-自訂背景圖,底圖寬高*/
#yblast .bg {width:85%;height:70px;}


/*招呼語-自訂背景圖,底圖位置*/
#yblast {position:relative;top:27px;left:17px;}


/*招呼語-文字寬高(建議這一段語法獨立寫)*/
#yblast .text {width:90%;height:70px;}


/*招呼語-文字置中-文字位置*/
#yblast .text{text-align:center; position:relative;top:-45px;left:-10px;}


/*招呼語-字體顏色-字型-大小-粗體(當招呼語有連結作用時,需在.text後空一格加入 a 改變為連結的字體作用*/
#yblast .text{color:#FF0000;font-family:標楷體;font-size:300%;font-weight:bold;}


/*Shared rounded corner for all modules 全欄位框線*/
.ycntmod {width:100%;position:relative;margin-bottom:10px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:url(圖01.gif) left top no-repeat;margin-right:5px;}
.ycntmod .rctop div {background:url(圖02.gif) right top no-repeat;height:10px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcbtm {zoom:1;background:url(圖03.gif) left bottom no-repeat;margin-right:5px;}
.ycntmod .rcbtm div {background:url(圖04.gif) right bottom no-repeat;height:10px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcl {padding-left:5px;background:url(圖05.gif) repeat-y;}
.ycntmod .rcr {zoom:1;padding-right:5px;background:url(圖06.gif) right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}


/*shared rounded corner for all modules 透明無框線*/
.ycntmod {width:100%;position:relative;margin-bottom:10px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:transparent left top no-repeat;margin-right:0px;}
.ycntmod .rctop div {background:transparent right top no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcbtm {zoom:1;background:transparent left bottom no-repeat;margin-right:0px;}
.ycntmod .rcbtm div {background:transparent right bottom no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcl {padding-left:0px;background:transparent repeat-y;}
.ycntmod .rcr {zoom:1;padding-right:0px;background:transparent right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}



/*隱藏框線*/
.ycntmod .rctop {background:none;}
.ycntmod .rctop div {background:none;}
.ycntmod .rcbtm {background:none;}
.ycntmod .rcbtm div {background:none;}
.ycntmod .rcl {background:none;}
.ycntmod .rcr {background:none;}


/*透明化無框線將background:url(圖片.gif) 改成 background:transparent 透過*/


/*標題框*/
#yblogtitle .rctop {zoom:1;background:url(圖01.gif) left top no-repeat;margin-right:5px;}
#yblogtitle .rctop div {background:url(圖02.gif) right top no-repeat;height:10px;font-size:0;position:relative;right:-5px;}
#yblogtitle .rcbtm {zoom:1;background:url(圖03.gif) left bottom no-repeat;margin-right:5px;}
#yblogtitle .rcbtm div {background:url(圖04.gif) right bottom no-repeat;height:10px;font-size:0;position:relative;right:-5px;}
#yblogtitle .rcl {padding-left:10px;background:url(圖05.gif) repeat-y;}
#yblogtitle .rcr {zoom:1;padding-right:10px;background:url(圖06.gif) right repeat-y;}


/*文章框*/
.yc3pribd .rctop {zoom:1;background:url(圖01.gif) left top no-repeat;margin-right:5px;}
.yc3pribd .rctop div {background:url(圖02.gif ) right top no-repeat;height:10px;font-size:0;position:relative;right:-5px;}
.yc3pribd .rcbtm {zoom:1;background:url(圖02.gif ) left bottom no-repeat;margin-right:5px;}
.yc3pribd .rcbtm div {background:url(圖04.gif ) right bottom no-repeat;height:10px;font-size:0;position:relative;right:-5px;}
.yc3pribd .rcl {padding-left:5px;background:url(圖05.gif ) repeat-y;}
.yc3pribd .rcr {zoom:1;padding-right:5px;background:url(圖06.gif ) right top repeat-y;}


/*左右側欄框線*/
.yc3sec .rctop,.yc3sub .rctop {zoom:1;background:url(圖01.gif ) left top no-repeat;margin-right:0px;}
.yc3sec .rctop div,.yc3sub .rctop div {background:url(圖02.gif ) right top no-repeat;height:10px;font-size:0;position:relative;right:-0px;}
.yc3sec .rcbtm,.yc3sub .rcbtm {zoom:1;background:url(圖03.gif ) left bottom no-repeat;margin-right:0px;}
.yc3sec .rcbtm div,.yc3sub .rcbtm div {background:url(圖04.gif ) right bottom no-repeat;height:10px;font-size:0;position:relative;right:-0px;}
.yc3sec .rcl,.yc3sub .rcl {padding-left:5px;background:url(圖05.gif ) repeat-y;}
.yc3sec .rcr,.yc3sub .rcr {zoom:1;padding-right:5px;background:url(圖06.gif ) right repeat-y;}


/*將預設兩欄式版型擴張(加寬)至左右邊界*/ /*注意!兩組二選一*/
.twocoldr .ycnt3col,.twocolga .ycnt3col {width:990px;}

.twocoldr .ycnt3col,.twocolga .ycnt3col {width:99.9%;}


/*隱藏左右欄位名稱標題*/
.yc3sec .mhd,.yc3sub .mhd{display:none}


/*隱藏文章欄位全部文章大標題*/
.yc3pribd .mhd{display:none}


/*隱藏性別小圖*/
#ymodprf .horos img{display:none;}


/*隱藏部落格相簿*/
#ymodalbum{display:none;}


/*隱藏更新日期欄*/
#ymodupdate{display:none}


/*隱藏摩頭摩尾(奇摩頁首與頁尾)*/
#yhtw_masthead, #yhtw_mastfoot{display:none;}


/*隱藏標題按鍵組*/
#yblogtitle .tft div a span{display:none;}


/*發表文章*/
div.btncompose a{display:block;width:76px;height:22px;overflow:hidden;background:url(
http://tw.yimg.com/i/tw/blog/btn_postblog.gif) no-repeat;}


/*上傳相片*/
div.btnphoto a{display:block;width:76px;height:22px;overflow:hidden;background:url(
http://tw.yimg.com/i/tw/blog/btn_ulimg.gif) no-repeat}


/*管理部落格*/
div.btnsetup a{display:block;width:92px;height:22px;overflow:hidden;background:url(
http://tw.yimg.com/i/tw/blog/yimg/btn_setupblog.gif) no-repeat}


/*訂閱部落格*/
div#btnsbsrb a,div#btnsbsrb_nologin a{display:block;width:89px;height:22px;overflow:hidden;background:url(
http://tw.yimg.com/i/tw/blog/btn_subscribe.gif) no-repeat;}


/*文章內文下方告示圖片*/
#yarticle .browsebtns{background:url(圖片網址) center bottom no-repeat;width:449px;height:100px;}


/*回應欄位圖片動畫*/
#rtemodule {background:url(圖片網址) no-repeat scroll center top;padding-top:120px;}


/*留言內容欄*/


/*文章欄我要留言按紐背景小圖-我要留言字體-顏色-字型-粗體字*/
#ymsgboard q a {background:url(背景小圖網址) no-repeat;color:#FF0000;font-family:標楷體;font-size:32px;font-weight:bold;}


/*留言板標題列高度-背景圖*/
#ymsgboard .mhd {height:100px;background:url(背景圖網址) repeat-y;}


/*留言板留言內容欄背景圖*/
#ymsgboard .mbd {background:url(背景圖網址) repeat-y;}


/*留言板透明度-注意!設為全透明時,背景圖無作用*/
#ymsgboard .rctop, #ymsgboard .rctop div, #ymsgboard .rcl, #ymsgboard .rcr, #ymsgboard .rcbtm, #ymsgboard .rcbtm div {zoom:1; filter:alpha(opacity:50)}


/*留言板標題留言板字體*/
#ymsgboard .mhd h3 {color:#ff00ff;font-family:新細明體;font-size:24px;}


/*留言板標題留言板字體置中 (此段不加入時,即置於左側)*/
#ymsgboard .mhd .text {text-align:center;}


/*留言板標題留言板字體隱藏 (此段如果覺得有礙美觀可應用)*/
#ymsgboard .mhd h3 {display:none;}


/*留言板留言內容字體*/
#ymsgboard .mbd .text {color:#0000ff;font-family:新細明體;font-size:16px;}


/*留言板所有連結字體*/
#ymsgboard .mbd .text a {color:#FF0000;font-family:新細明體;font-size:20px;}


/*版面寬度定位*/


/*版面寬度定位-三欄式*/
.thrcol #yhtw_mastfoot {width:995px;margin:0 auto;}
.thrcol[class]{min-width:995px;behavior:none; }
.thrcol .ycnt3col {zoom:1;width:995px;text-align:left;margin:0 auto;}


/*版面寬度定位-二欄式*/
.twocolga #yhtw_mastfoot, .twocoldr #yhtw_mastfoot {width:950px;margin:0 auto;}
.twocolga[class], .twocoldr[class]{min-width:950px;behavior:none;}
.twocolga .ycnt3col,.twocoldr .ycnt3col {zoom:1;width:950px;text-align:left;margin:0 auto;}


/*捲軸顏色變更設定*/
html{
scrollbar-base-color : #ff0000; /*整體顏色*/
scrollbar-face-color : #000000; /*軸面顏色*/
scrollbar-track-color: #000000; /*軸軌顏色*/
scrollbar-arrow-color : #ff0000 ;/*箭頭顏色*/
scrollbar-3dlight-color: #ff0000; /*左立體邊顏色*/
scrollbar-highlight-color : #ff0000; /*軸面左角邊顏色*/
scrollbar-shadow-color : #ff0000; /*軸面右角邊顏色*/
scrollbar-darkshadow-color : #ff0000; /*右立體邊顏色*/
}

語法背景色&文字顏色設定大略註解:


background-color:#FFFFFF (顏色碼) 設定背景顏色。
簡例:background:#6699CC;


color:設定字體顏色。
例:color:#FF9900; (#FF9900為顏色代碼參閱色碼表變更)


font-family:設定文字字型。
例:font-family:新細明體;


font-size:設定文字大小。(必須為正整數)
例1:font-size:20px;
例2:font-size:120%;


text-align:決定 文字水平對齊方式。left:靠左對齊 center:置中對齊 right:靠右對齊
例:text-align:center;


font-weight(文字粗細):設定文字粗細。normal:正常 bold:粗體 bolder:特粗 細體:lighter
例:font-weight:bold;


width(寬):區塊的寬度 (不設定,依系統原訂大小)
height(高):區塊的高度 (不設定,依系統原訂大小)


指定背景圖位置


/*背景圖片x與y軸的位置*/


backgroud-position: 0% 0%; /*左邊上方*/
backgroud-position: 0% 50%; /*左邊中間*/
backgroud-position: 50% 0%; /*中間上方*/
backgroud-position: 50% 50%; /*正中間*/
backgroud-position:100% 0%; /*右邊上方*/
backgroud-position: 0% 100%; /*左邊下方*/
backgroud-position: 100% 50%; /*右邊中間*/
backgroud-position: 50% 100%; /*中間下方*/
backgroud-position: 100% 100%; /*右邊下方*/


background-position : top; /*向上對齊*/
background-position : bottom; /*向下對齊*/
background-position : left; /*向左對齊*/
background-position : right; /*向右對齊*/
background-position : center; /*置中對齊*/


圖片重複方向 :


repeat = 整頁重複


repeat-x = 橫向排列,適用垂直條形圖


repeat-y = 縱向排列,適用水平條形圖


no-repeat = 單張圖片不重複,適用與架框同等長寬的圖片


邊框語法解說 :


border-left:5px double #00ffff; border-right:5px double #00ffff; border-top:5px double #00ffff; border-bottom:5px double #00ffff;


left = 左邊框


right = 右邊框


top = 上邊框


bottom = 下邊框


double = 雙線 (請參考框線條樣式)


5px = 框線粗細像素值 (一般使用在1~5之間)


#ff00ff = 框線顏色色碼 (可搭配個人使用的背景配色,請參考色碼表)


框線條樣式 : ( 無、點線、實線、雙線、溝線、脊線、嵌入線、浮出線 )


相對應語法 : none︱ dotted|solid︱ double︱ groove︱ ridge︱ inset︱ outset


貼語法路徑→管理部落格→面板設定→自訂樣式→加入語法→確定


色碼表應用 : (注意 : 有些數字色碼無支援應用在奇摩部落格當邊框顏色,無支援的貼上只會顯示灰色)


大部分取自語法應用編輯(二度空間)


參閱文章網址( http://tw.myblog.yahoo.com/jw!.KNty8iGR0WBlosOtiUpDA--/article?mid=7489 )


整理補充編輯:



引用:http://tw.myblog.yahoo.com/jw!zgGA9hWTEg6DAB0jiS5wNn8-/article?mid=15204


引用:http://tw.myblog.yahoo.com/jw!R.LG_UeaHBKsESHCfX.uaT0-/article?mid=13972

oreokimo 發表在 痞客邦 留言(0) 人氣()


 




有時看到美美的版型,想要套用到自己的部落格時


又被滿滿的語法給淹沒了,看得”花撒撒”


剛好有空,所以把套用的步驟給記下來


提供給想要美美版型的格友們,可以依步驟一步一步也把自己的部落格給美化


通常,各版主都會不吝分享自製的版型,但~千萬不要自己再拿來自行組合再發表給別人使用喔!



首先,看到喜歡的版型時,先移到下方,注意分享的版主所規定的一些注意事項


就是每個版所需套用的樣版基底為何,要先記起來,這樣等一下在套版型時


置頂區才會美美的喔!!


接著在下方有語法取得的圖,按下去去取得該版型的語法




畫面會跳到語法頁,從中文的游漂圖示開始複製到最下面的語法


很長一串喔!都要記得不要漏了,每一個都要複製到


(要是不想要游標的,就由游標下方的body字樣開始複製)



複製好時則回到自己的部落格按到管理部落格中的更換樣版


把它給換成剛剛所需的樣版基底



畫面會跳到下方,看所需的在那裡,點進去選好圖後按確定



接著會出現下列字樣,按確定即可更換完成


提醒:更換樣版後,會重設自訂樣版中的樣式表,確定要繼續?



再來,先不要急著回自己的部落格喔!!還有一個步驟還沒完成


剛剛複製版型的語法還沒貼,在左列欄中的面版設定裡有一個自訂樣式鍵


按進去,按清除鍵把原有的內容清除,接著再貼上複製版型的語法,再按確定就完成囉!


就可以回自己的部落格用美美的版型了,每每要更換不同版型時,也就是以此方法



看到美美的版,想要拿取語法時,也給版主一個友好的回應喔!!


謝謝瑀婈格版型資料分享


以上純屬分享,希望對大家有幫助唷!!


☆瑀婈補充:咚咚這個教學做的真的太棒了.


瑀婈常常會過去看格友們使用版型的情形.


常常都是...無法呈現創作著所想要的完美狀態.


希望愛換格子新衣裳的朋友們用心學起來唷!


 









ivr



引用:http://tw.myblog.yahoo.com/jw!wC05gveQSUUm5Lb.ZXKEoO2eS8FBmyXz/article?mid=36634

oreokimo 發表在 痞客邦 留言(0) 人氣()








 
















 

點下列圖示預覽 ↓

 


* 要用IE才能正常預覽 * 

 


 










 


 

圖片來源: 網路

  

霝兒製作加工分享 


 





 

 

 

引用:http://tw.myblog.yahoo.com/jw!V3nxAk.BFRm.p9KGFpExf.kL8ws_/article?mid=18029

oreokimo 發表在 痞客邦 留言(0) 人氣()





         版型語法      


 


















/*語法複製開始*/



/*大標題圖背景+重覆底背景設定*/
body {background:url(http://pcdn1.rimg.tw/photos/2491437_x2mvpt2_l.gif) center top transparent no-repeat;}
html {background:url(http://pcdn1.rimg.tw/photos/2491439_2tvxuxg_l.gif) center top #ffffff repeat;}

/*btnsbsrb訂閱部落格圖示*/
div#btnsbsrb a, div#btnsbsrb_nologin a{display:block;width:130px;height:52px;overflow:hidden;background:url(http://pcdn1.rimg.tw/photos/2491421_j7gxbjg_l.gif) no-repeat;margin:0;}

/*回應引用圖*/
div.btncomment a {display:block;width:130px;height:75px;background:url(http://pcdn1.rimg.tw/photos/2491435_byopmij_l.gif) no-repeat;}
div.btntrackback a {display:block;width:130px;height:75px;background:url(http://pcdn1.rimg.tw/photos/2491429_85noojf_l.gif) no-repeat;}


/*文章前小圖設定*/
.yblogcnt .blgtitlebar {margin-bottom:9px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:125%;font-weight:bold;background:url(http://pcdn1.rimg.tw/photos/2491431_czu2my_l.gif) no-repeat;padding-top:1px;padding-left:119px;height:57px;}

/*側欄區上標*/
.yc3sec .mhd, .yc3subbd .mhd, .yc3sec .mhd a, .yc3subbd .mhd a, .yc3sec .mhd a:link, .yc3subbd .mhd a:link, .yc3sec .mhd a:visited, .yc3subbd .mhd a:visited{background:transparent;color:#B23975;text-align:center;}

/*側欄區內文*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background:transparent;color:#A3346B;}
#ymodfolder .mbd, #ymodnewcomt .mbd, #ymodnewart .mbd {HEIGHT:250px;OVERFLOW:auto;position:relative;}

/*文章區上標*/
.yc3pribd .mhd{background:#ffffff;color:#FF0078;font-family:標楷體;font-size:14px;text-align:left;}

/*文章內文及文章區*/
.yc3pribd .mbd{background:#ffffff;color:#00003C;}
.yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p {background:#ffffff;color:#00003C;}
#ymodcal .mbd td strong {color:#00003C;}

/*編輯刪除按鈕圖片設定*/
div.btnblgedit, div.btnblgdel, div.btnblgreport, div.btncmntdel {background:transparent;border:1px solid #5b1954;}
.reportbtns span{background:transparent;border:1px solid #5b1954;}


/*連結文字及位置顏色改變設定*/
a, a:link, a:visited{color:#000080;text-decoration:none;}
a:hover{color:#800080;position:relative;top:2px;}

/*招呼語不放背景及文字顏色設定*/
#yblast .bg {filter:alpha(opacity=0);opacity:0;}
#yblast .text{color:#400000;}

/*部落格描述及名稱連結底色及文字顏色設定*/
#yblogtitle .mbd, #yblogtitle .mft{background:url(http://);color:#400000;padding:600px 150px 0px 150px;text-align:center;}
#yblogtitle h1, #yblogtitle a {color:#400000;font-size:18px;font-weight:bolder;font-family:新細明體;}
#yblogtitle .tft {margin:50px 50px 0px 0px;}

/*捲軸區色彩設定*/
html{SCROLLBAR-FACE-COLOR:#FFFFFF;
SCROLLBAR-3DLIGHT-COLOR:#FFFFFF;
SCROLLBAR-ARROW-COLOR:#FFFFFF;
SCROLLBAR-TRACK-COLOR:#FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR:#FFFFFF;
}


/*奇摩置尾區不顯示*/
#yhtw_mastfoot{display:none;}

 

/******框框的設定******/
/*二欄式版面加大寬度設定*/
.twocolga .yc3main {width:100%;float:left;}
.twocolga .yc3mainbd {margin-right:25px;}
.twocolga .yc3pri {width:100%;}
.twocolga .yc3subbd {width:190px;position:absolute;right:-10px;}
.twocolga .yc3sec {display:none;}
.twocolga #yhtw_mastfoot, .twocoldr #yhtw_mastfoot {width:900px;margin:0 auto;}
.twocolga, .twocoldr{min-width:900px;}
.twocolga .ycnt3col, .twocoldr .ycnt3col {zoom:1;width:900px;text-align:left;margin:0 auto;}

/*三欄式版面寬度設定*/
.thrcol #yhtw_mastfoot {width:990px;margin:0 auto;}
.thrcol{min-width:990px;}
.thrcol .ycnt3col {zoom:1;width:990px;text-align:left;margin:0 auto;}
.thrcol .yc3main {width:100%;float:left;}
.thrcol .yc3mainbd {margin-left:200px;}
.thrcol .yc3pri {width:100%;float:right;}
.thrcol .yc3pribd {margin-right:205px;}
.thrcol .yc3subbd {width:190px;float:left;position:absolute;right:10px;}
.thrcol .yc3sec {width:190px;float:right;position:absolute;left:10px;}

#yblogtitle .rctop{background:transparent left top no-repeat;margin-right:0px;}
#yblogtitle .rctop div{background:transparent right top no-repeat;height:0px;right:-0px;}
#yblogtitle .rcl{background:transparent repeat-y;border:none;}
#yblogtitle .rcr{background:transparent right repeat-y;}
#yblogtitle .rcbtm {background:transparent left bottom no-repeat;margin-right:0px;}
#yblogtitle .rcbtm div {background:transparent right bottom no-repeat;height:0px;right:-0px;}
.ycntmod {width:100%;position:relative;margin-bottom:15px;overflow:hidden;}

.yc3sec .rctop, .yc3sub .rctop {zoom:1;background:url(http://pcdn1.rimg.tw/photos/2491425_ljjdrx4_l.gif) no-repeat;}
.yc3sec .rctop div, .yc3sub .rctop div {background:transparent right top no-repeat;height:41px;font-size:0;position:relative;right:-0px;}
.yc3sec .rcbtm, .yc3sub .rcbtm {zoom:1;background:url(http://pcdn1.rimg.tw/photos/2491423_jui1zga_l.gif) no-repeat;}
.yc3sec .rcbtm div, .yc3sub .rcbtm div {background:transparent right bottom no-repeat;height:39px;font-size:0;position:relative;right:-0px;}
.yc3sec .rcl, .yc3sub .rcl {padding-left:18px;background:url(http://pcdn1.rimg.tw/photos/2491427_zl2el0r_l.gif) repeat-y;border:none;}
.yc3sec .rcr, .yc3sub .rcr {zoom:1;padding-right:24px;background:transparent right repeat-y;border:none;}

 

 

/*=============語法結束===========*/


 

 

 


/*======請注意以下是隠藏語法請自行選擇,若不想隱藏,只要刪除那一段語法即可======*/
/*特殊選項設定_感謝柏憲妙方*/
/*文章分類--最新回應--最新文章--捲軸內容高度--內容超出區塊自動由瀏覽器決定-相對定位*/
 #ymodfolder .mbd, #ymodnewcomt .mbd, #ymodnewart .mbd {HEIGHT:250px;OVERFLOW:auto;position:relative;}
#yblast .text a{display:none;}/*隱藏招呼語的我要留言*/
body{overflow-x:hidden;}/*隱藏下方捲軸*/
#yhtw_mastfoot{display:none;} /*隱藏雅虎頁尾 */
#ymodalbum{display:none;} /*隱藏部落格相簿*/
#ymodmsgbd h3{display:none;} /*隱藏留言板*/
#ymodmsgbd{display:none;}/*隱藏留言板欄位*/
div.date {display:none} /*隱藏發文時間*/
#ymodupdate {display:none;} /*隱藏更新日期*/
#ymodcal{display:none;}/*隱藏月曆欄位*/

/*文章廣告不要顯示但是還有上下篇*/
.ysm  {display:none;}
.ysm .ysmlabel {display:none;}
.ysm DL {display:none;}
.ysm DL.last {display:none;}.

/*隱藏奇摩部落格網頁~頁首和頁尾欄位*/
#yhtw_masthead,#yhtw_mastfoot{display:none;}


引用:http://tw.myblog.yahoo.com/jw!pf5o7h.RGB4ASP5k0ZpuP432ww--/article?mid=32

oreokimo 發表在 痞客邦 留言(0) 人氣()

-預覽照

 


4.jpg


ug0aff79.gif         ug0cce1d.gif       ug04619a.gif


 129_marsss7.gif


1.建議要使用版型語法之前,請先到管理部落格/面版設定/各式樣版/簡單/第二款:


    


    如上所示選這個模樣小樣, 先把置頂管理區調整比較有美感


2.再回到管理部落格/面板設定/自訂樣式 /先按『清除』再完整複製貼上以下的版型語法



建議不要奇摩裡自設進階樣式 否則會使框呈現黑底 日曆也會變形



三欄式or兩欄式 - 靠右寬語法



/*二欄式版面窄欄靠右加大寬度設定*/
.twocolga .yc3main {width:100%;float:left;}
.twocolga .yc3mainbd {margin-right:25px;}
.twocolga .yc3pri {width:100%;}
.twocolga .yc3subbd {width:190px;position:absolute;right:-10px;}
.twocolga .yc3sec {display:none;}
.twocolga #yhtw_mastfoot, .twocoldr #yhtw_mastfoot {width:990px;margin:0 auto;}
.twocolga[class], .twocoldr[class]{min-width:990px;}
.twocolga .ycnt3col, .twocoldr .ycnt3col {zoom:1;width:990px;text-align:left;margin:0 auto;}
/*
三欄式版面加大寬度設定
*/
.thrcol #yhtw_mastfoot {width:1020px;margin:0 auto;}
.thrcol[class]{min-width:1020px;}
.thrcol .ycnt3col {zoom:1;width:1020px;text-align:left;margin:0 auto;}
.thrcol .yc3main {width:100%;float:left;}
.thrcol .yc3mainbd {margin-left:185px;}
.thrcol .yc3pri {width:100%;float:right;}
.thrcol .yc3pribd {margin-right:185px;}
.thrcol .yc3subbd {width:171px;float:left;position:absolute;right:10px;}
.thrcol .yc3sec {width:171px;float:right;position:absolute;left:10px;}



/*回應下方圖片*/


#yartcmt .pagination strong{display:none;}


#yartcmt .pagination{height:153px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e3805/5694947/221355810_x.jpg) no-repeat center bottom}


 



 

/*自訂格名及部落格描述字+大底圖動畫*/
#yblogtitle .mbd,#yblogtitle .mft{background:transparent;color: #7d022a;padding-top:320px;text-align:center; }
#yblogtitle h1, #yblogtitle a {color:
#7d022a; font-size:20px;font-weight:bolder;font-family:
華康娃娃體
;}
#yblogtitle .tbd{height:18px }


 


#yblogtitle .mbd{background:url(http://i1125.photobucket.com/albums/l581/bzaoayz/f_428186_1.gif);}
body {background:url(
http:// ) center top transparent no-repeat;}
html {background:url(
http:// ) center top;}



#yblogtitle .tft {margin:100px 0px 50px 0px;} /*
三按鍵位置設定*/

/*
大標題圖背景+重覆底背景設定
*/
body {background:url(http://i1125.photobucket.com/albums/l581/bzaoayz/40.jpg) center top transparent no-repeat;}
html {background:url(http://i.imgur.com/pss0G.jpg) center top #da7d10 repeat;}



/*
文章前小圖設定*/
.yblogcnt .blgtitlebar {margin-bottom:9px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:125%;font-weight:bold;background:url(http://0.share.photo.xuite.net/bzaoayz/10e38ef/5694947/221339404_x.jpg) no-repeat;padding-left:20px;}


 


/*Nav module header左右標題文字大小顏色*/
.yc3sec .mhd a:link, .yc3subbd .mhd a:link,.yc3sec .mhd a:visited, .yc3subbd .mhd a:visited{ background:transparent ;color: #a52a2a;text-align:center;padding-top:15px;}
.yc3sec .mhd, .yc3subbd .mhd, .yc3sec .mhd a, .yc3subbd .mhd a{font-size:120%;background:url(
http://0.share.photo.xuite.net/bzaoayz/10e385e/5694947/221331323_x.jpg ) top center ;color: #a52a2a;text-align:center;height:118px;}


 


/*左右欄位小圖*/
.ycntmod .mbd ul.list li{background-image:url(
http://0.share.photo.xuite.net/bzaoayz/10e38ee/5694947/221339403_x.jpg);background-repeat:no-repeat
; padding-left:22px;padding-top:12px;_line-height:12px}



/*
側欄區內文底色及文字顏色設定*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background:transparent;color:
#da7d10;}
 /*
文章區上標底色及文字顏色設定
*/
.yc3pribd .mhd{ background:url(http://0.share.photo.xuite.net/bzaoayz/10e3869/5694947/221340806_x.jpg) no-repeat ;padding-left:10px;padding-top:10px; color:
#a52a2a
;} 
/*
文章內文及文章區底色及文字顏色設定
*/
.yc3pribd .mbd,.yc3pribd .mft{ padding:10px;background:transparent;color:
#000000;}



/*btnsbsrb訂閱部落格圖示*/
div#btnsbsrb a,div#btnsbsrb_nologin a{display:block;width:120px;height:45px;overflow:hidden;background:url(
http://0.share.photo.xuite.net/bzaoayz/10e3847/5694947/221355364_x.jpg
) no-repeat;margin:0;border:2px outset #da7d10;}
/*make coomment bar
回應跟引用更換圖片語法
*/
div.btncomment a {display:block;height:60px;width:80px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e381b/5694947/221335608_x.jpg) no-repeat;}
div.btntrackback a {display:block;height:60px;width:80px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e38bd/5694947/221335002_x.jpg) no-repeat;}
/*
編輯刪除按鈕圖片設定
*/
div.btnblgedit,div.btnblgdel,div.btnblgreport,div.btncmntdel {background:transparent;border:2px outset #C6BEA7;}
.reportbtns span{background:transparent;border:2px outset #C6BEA7;}
/*INPUT
搜尋圖片設定
*/
input, select{background:transparent;color:
#a52a2a;}


/*捲軸區色彩設定*/
html{SCROLLBAR-FACE-COLOR:
#da7d10;
SCROLLBAR-3DLIGHT-COLOR:
#da7d10;
SCROLLBAR-ARROW-COLOR:#ffffff;
SCROLLBAR-TRACK-COLOR:#ffffff;
SCROLLBAR-DARKSHADOW-COLOR:
#da7d10;
SCROLLBAR-BASE-COLOR:#4E7CAE;}
/*
個人資料管理頁面公開的部落標題+管理回應文字顏色設定
*/
#ybloginfo table, #yusrinfo table, #yusrintro p ,.listbd,#ycmntlist table th ,#ycmntlist .btncmntre{background:transparent #ffffff ;color:
#da7d10;}
/*
招呼欄位底色及文字顏色設定
*/
#yblast .bg {background: transparent}
#yblast .text{color:
#a52a2a;}


 


/*部落格相簿更換圖片*/
#ymodalbum h3 a {display:block;background:url() repeat;color: #a52a2a;width:130px;height:39px;}


/*統計資料+月曆+更新日文字顏色*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background:transparent; color: #c6a077;}


/*奇摩置尾區不顯示*/
#yhtw_mastfoot{display:none}
/*
月曆粗體日期顏色設定
*/
 #ymodcal .mbd td strong {color:
#da7d10;}
/*
連結文字及位置顏色改變設定
*/
a, a:link, a:visited{color: #da7d10;text-decoration:none;}
a:hover{color: #da7d10;position:relative;top:2px;}


#yblogtitle .rctop{background:transparent left top no-repeat;margin-right:0px;}
#yblogtitle .rctop div{background:transparent right top no-repeat;height:0px;right:-0px;}
#yblogtitle .rcl{background:transparent repeat-y;border:none;}
#yblogtitle .rcr{background:transparent right repeat-y;}
#yblogtitle .rcbtm {background:transparent left bottom no-repeat;margin-right:0px;}
#yblogtitle .rcbtm div {background:transparent right bottom no-repeat;height:0px;right:-0px;}
.ycntmod {width:100%;position:relative;margin-bottom:15px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:transparent repeat;margin-right:0px;}
.ycntmod .rctop div {background:transparent right top no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcbtm {zoom:1;background:transparent repeat;margin-right:0px;}
.ycntmod .rcbtm div {background:transparent right bottom no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcl {padding-left:0px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e386a/5694947/221981063_x.jpg) repeat-y;border:1px #da7d10 solid}
.ycntmod .rcr {zoom:1;padding-right:0px;background:transparent right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}







 


/*消除文章下廣告框及廣告文字*/


.ysm  {display:none;}
.ysm .ysmlabel {display:none;}
.ysm DL {display:none;}
.ysm DL.last {display:none;}


 


/**************************************************************************/

/*
以下若要顯示請不要放上即可
*/


 


#ymodupdate {display:none;} /*隱藏更新日期*/



/*隱藏部落格相簿*/
#ymodalbum{display:none;}
/*
隱藏我要留言免受廣告干擾*/
#yblast .text a{display:none;}
/*
特殊選項設定_感謝柏憲妙方*/
/*
文章分類--最新回應--最新文章--捲軸內容高度--內容超出區塊自動由瀏覽器決定-相對定位*/
 #ymodfolder .mbd, #ymodnewcomt .mbd, #ymodnewart .mbd {HEIGHT:250px;OVERFLOW:auto;position:relative;}


 


 



左欄加寬方式~



 


我覺對一般來說真的有點難~所以我直接把語法放上來~直接套用就好~


 



 


4-2.jpg


 


左欄加寬語法~


 


 



 


接下來跟三欄式設定一樣~


 



語法複製開始↓



左欄專用


 


BODY {TEXT-ALIGN:center;}


 


.thrcol.class {min-width:1000px;}


.thrcol .ycnt3col {width:1000px;text-align:left;margin:0 auto;}


.thrcol .yc3mainbd {margin-left:185px;}


.thrcol .yc3pribd {margin-right:0px;}


.thrcol .yc3sec {position:absolute;width:180px;left:0px;}


.thrcol .yc3subbd {width:0px;}


 


 


BODY {TEXT-ALIGN:center;}


 


.twocolga .yc3main {width:100%;float:left;}


.twocolga .yc3mainbd {margin-right:55px;}


.twocolga .yc3pri {width:100%;}


.twocolga .yc3subbd {width:185px;position:absolute;right:0px;}


.twocolga .yc3sec {display:none;}


.twocolga #yhtw_mastfoot, .twocoldr #yhtw_mastfoot {width:900px;margin:0 auto;}


.twocolga, .twocoldr{min-width:10px;}


.twocolga .ycnt3col, .twocoldr .ycnt3col {zoom:1;width:900px;text-align:left;margin:0 auto;}


 


/*二欄式版面窄欄靠左加大寬度設定*/
.twocolga .yc3main {width:100%;float:left;}
.twocolga .yc3mainbd {margin-right:25px;}
.twocolga .yc3pri {width:100%;}
.twocolga .yc3subbd {width:190px;position:absolute;right:-10px;}
.twocolga .yc3sec {display:none;}
.twocolga #yhtw_mastfoot, .twocoldr #yhtw_mastfoot {width:990px;margin:0 auto;}
.twocolga[class], .twocoldr[class]{min-width:990px;}
.twocolga .ycnt3col, .twocoldr .ycnt3col {zoom:1;width:990px;text-align:left;margin:0 auto;}

/*回應下方圖片*/


#yartcmt .pagination strong{display:none;}


#yartcmt .pagination{height:153px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e3805/5694947/221355810_x.jpg) no-repeat center bottom}


 


/*自訂格名及部落格描述字+大底圖動畫*/
#yblogtitle .mbd,#yblogtitle .mft{background:transparent;color: #7d022a;padding-top:320px;text-align:center; }
#yblogtitle h1, #yblogtitle a {color:
#7d022a; font-size:20px;font-weight:bolder;font-family:
華康娃娃體
;}
#yblogtitle .tbd{height:18px }


 


#yblogtitle .mbd{background:url(http://i1125.photobucket.com/albums/l581/bzaoayz/f_428186_1.gif);}
body {background:url(
http:// ) center top transparent no-repeat;}
html {background:url(
http:// ) center top;}




#yblogtitle .tft {margin:100px 0px 50px 0px;} /*


三按鍵位置設定*/

/*大標題圖背景+重覆底背景設定*/
body {background:url(http://i1125.photobucket.com/albums/l581/bzaoayz/40.jpg) center top transparent no-repeat;}
html {background:url(http://i.imgur.com/pss0G.jpg) center top #da7d10 repeat;}

/*文章前小圖設定*/
.yblogcnt .blgtitlebar {margin-bottom:9px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:125%;font-weight:bold;background:url(http://0.share.photo.xuite.net/bzaoayz/10e38ef/5694947/221339404_x.jpg) no-repeat;padding-left:20px;}


 


/*Nav module header左右標題文字大小顏色*/
.yc3sec .mhd a:link, .yc3subbd .mhd a:link,.yc3sec .mhd a:visited, .yc3subbd .mhd a:visited{ background:transparent ;color: #a52a2a;text-align:center;padding-top:15px;}
.yc3sec .mhd, .yc3subbd .mhd, .yc3sec .mhd a, .yc3subbd .mhd a{font-size:120%;background:url(
http://0.share.photo.xuite.net/bzaoayz/10e385e/5694947/221331323_x.jpg ) top center ;color: #a52a2a;text-align:center;height:118px;}


 


/*左右欄位小圖*/
.ycntmod .mbd ul.list li{background-image:url(
http://0.share.photo.xuite.net/bzaoayz/10e38ee/5694947/221339403_x.jpg);background-repeat:no-repeat
; padding-left:22px;padding-top:12px;_line-height:12px}



/*
側欄區內文底色及文字顏色設定*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background:transparent;color:
#da7d10;}
 /*
文章區上標底色及文字顏色設定
*/
.yc3pribd .mhd{ background:url(http://0.share.photo.xuite.net/bzaoayz/10e3869/5694947/221340806_x.jpg) no-repeat ;padding-left:10px;padding-top:10px; color:
#a52a2a
;} 
/*
文章內文及文章區底色及文字顏色設定
*/
.yc3pribd .mbd,.yc3pribd .mft{ padding:10px;background:transparent;color:
#000000;}



/*btnsbsrb訂閱部落格圖示*/
div#btnsbsrb a,div#btnsbsrb_nologin a{display:block;width:120px;height:45px;overflow:hidden;background:url(
http://0.share.photo.xuite.net/bzaoayz/10e3847/5694947/221355364_x.jpg
) no-repeat;margin:0;border:2px outset #da7d10;}
/*make coomment bar
回應跟引用更換圖片語法
*/
div.btncomment a {display:block;height:60px;width:80px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e381b/5694947/221335608_x.jpg) no-repeat;}
div.btntrackback a {display:block;height:60px;width:80px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e38bd/5694947/221335002_x.jpg) no-repeat;}
/*
編輯刪除按鈕圖片設定
*/
div.btnblgedit,div.btnblgdel,div.btnblgreport,div.btncmntdel {background:transparent;border:2px outset #C6BEA7;}
.reportbtns span{background:transparent;border:2px outset #C6BEA7;}
/*INPUT
搜尋圖片設定
*/
input, select{background:transparent;color:
#a52a2a;}


/*捲軸區色彩設定*/
html{SCROLLBAR-FACE-COLOR:
#da7d10;
SCROLLBAR-3DLIGHT-COLOR:
#da7d10;
SCROLLBAR-ARROW-COLOR:#ffffff;
SCROLLBAR-TRACK-COLOR:#ffffff;
SCROLLBAR-DARKSHADOW-COLOR:
#da7d10;
SCROLLBAR-BASE-COLOR:#4E7CAE;}
/*
個人資料管理頁面公開的部落標題+管理回應文字顏色設定
*/
#ybloginfo table, #yusrinfo table, #yusrintro p ,.listbd,#ycmntlist table th ,#ycmntlist .btncmntre{background:transparent #ffffff ;color:
#da7d10;}
/*
招呼欄位底色及文字顏色設定
*/
#yblast .bg {background: transparent}
#yblast .text{color:
#a52a2a;}


 


/*部落格相簿更換圖片*/
#ymodalbum h3 a {display:block;background:url() repeat;color: #a52a2a;width:130px;height:39px;}


/*統計資料+月曆+更新日文字顏色*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background:transparent; color: #c6a077;}


/*奇摩置尾區不顯示*/
#yhtw_mastfoot{display:none}
/*
月曆粗體日期顏色設定
*/
 #ymodcal .mbd td strong {color:
#da7d10;}
/*
連結文字及位置顏色改變設定
*/
a, a:link, a:visited{color: #da7d10;text-decoration:none;}
a:hover{color: #da7d10;position:relative;top:2px;}


#yblogtitle .rctop{background:transparent left top no-repeat;margin-right:0px;}
#yblogtitle .rctop div{background:transparent right top no-repeat;height:0px;right:-0px;}
#yblogtitle .rcl{background:transparent repeat-y;border:none;}
#yblogtitle .rcr{background:transparent right repeat-y;}
#yblogtitle .rcbtm {background:transparent left bottom no-repeat;margin-right:0px;}
#yblogtitle .rcbtm div {background:transparent right bottom no-repeat;height:0px;right:-0px;}
.ycntmod {width:100%;position:relative;margin-bottom:15px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:transparent repeat;margin-right:0px;}
.ycntmod .rctop div {background:transparent right top no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcbtm {zoom:1;background:transparent repeat;margin-right:0px;}
.ycntmod .rcbtm div {background:transparent right bottom no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcl {padding-left:0px;background:url(http://0.share.photo.xuite.net/bzaoayz/10e386a/5694947/221981063_x.jpg) repeat-y;border:1px #da7d10 solid}
.ycntmod .rcr {zoom:1;padding-right:0px;background:transparent right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}








/*消除文章下廣告框及廣告文字*/


.ysm  {display:none;}
.ysm .ysmlabel {display:none;}
.ysm DL {display:none;}
.ysm DL.last {display:none;}



/**************************************************************************/

/*
以下若要顯示請不要放上即可
*/


 


#ymodupdate {display:none;} /*隱藏更新日期*/



/*隱藏部落格相簿*/
#ymodalbum{display:none;}
/*
隱藏我要留言免受廣告干擾
*/
#yblast .text a{display:none;}
/*
特殊選項設定_感謝柏憲妙方
*/
/*
文章分類--最新回應--最新文章--捲軸內容高度--內容超出區塊自動由瀏覽器決定-相對定位
*/
 #ymodfolder .mbd, #ymodnewcomt .mbd, #ymodnewart .mbd {HEIGHT:250px;OVERFLOW:auto;position:relative;}


 




照片素材-引用-Google.


 





這個比桃紅色鬱金香早做好ㄋ~~~只是那個我修改好久~所以乾脆就先發那個了~


感謝支持原創~不然老是遇到一些….現在讓我有點學不下去的感覺..


引用:http://tw.myblog.yahoo.com/jw!cs6EvQWABUELErDQgEI-/article?mid=50402

oreokimo 發表在 痞客邦 留言(0) 人氣()



有時候您在網路上,看到自己很喜歡的SWF動畫,想拿來當文章背景圖,或是當成公告板的背景。可是,要怎樣在SWF動畫上,打上文字呢?


讓我們一起來試試如何?


請將這個語法,貼到觀看HTML 原始碼(或是先貼到記事本修改,然後貼過來)


<div align=center>
<table style="WIDTH: 0px; BACKGROUND-REPEAT: no-repeat; BORDER-COLLAPSE: collapse; HEIGHT: 0px" cellSpacing=0 cellPadding=0 border=0><embed src=網址 width=640 height=460 type=application/x-shockwave-flash wmode="transparent" allowscriptaccess="never"></embed>
<tbody>
<tr>
<td>
<div style="LEFT: 50px; width: 620px; POSITION: absolute; TOP: 175px; height: 150px">
<font face=標楷體 color=#40a0ff size=5>文字內容放在這裡<br>換下一行</font></p>
</div><div></div></td></tr></tbody></table></div>



1.加上 swf動畫的網址,設定要呈現的大小
(src=網址 width=640 height=460 )


2.設定文字離文字框向右多少px
(style="LEFT: 50px;)


3.設定文字框所要呈現的寬度
(width: 620px;)


4.設定文字離文字框頂的距離
(TOP: 175px; )


5.設定文字框的高度
(heigh: 150pxt)


6.設定文字的字體,顏色,大小
(<font face=標楷體 color=#40a0ff size=5>)


7..加入文字,文字用<br>換行
(文字內容放在這裡<br>文字換行)


8.先用隱藏發表,看看文字的位置,調整第 2 和第 4 步驟的數字,讓文字放在最適合的位置。


9.滿意之後,配上音樂,加入自己喜歡的音樂語法在下方。(不加音樂就省略)


10.立即發表。(醬就行囉...)


 


 


11.動畫可以自己創作,或選用網路上的分享。
swf 動畫收集  swf 動畫 收集站  swf 動畫背景(透明)  640 幅 浪漫情境swf 動畫


12.找到自己喜歡的動畫,要先下載,然後上傳到雅虎有支援的的網路空間,才能使用。
  1.不會下載的人,請參考 怎樣下載網路上的 swf 動畫呢?
  2.不會上傳的人,請參考  您的 swf 動畫又跑掉了嗎?


 



13.這是這篇範例的語法,提供參考


<div align=center>
<table style="WIDTH: 0px; BACKGROUND-REPEAT: no-repeat; BORDER-COLLAPSE: collapse; HEIGHT: 0px" cellSpacing=0 cellPadding=0 border=0><embed src=http://img375.imageshack.us/img375/8128/t181.swf width=640 height=460 type=application/x-shockwave-flash wmode="transparent" allowscriptaccess="never"></embed>
<tbody>
<tr>
<td>
<div style="LEFT: 50px; WIDTH: 620px; POSITION: absolute; TOP: 175px; HEIGHT: 150px">
<p><font face=標楷體 color=#ffffff size=4>


不變的是<br><br>


不變的是,你笑的眼睛,有喜悅的線條<br>
不變的是,你吹亂的髮,像在想念我<br><br>


不變的是,你沉默嘴角,有千言萬語<br>
不變的是,你的陪伴,那種孤單時可以靠得溫暖<br><br>


而如今在不變的承諾中,有了輕輕柔柔的變動<br>
而如今在不變的承諾中,變了的心外表不變的愛情<br><br>


於是不變的是,我的傷心<br>
於是不變的是,我永遠假裝不知情 </font></p></div>


 


14.這樣子,您就可以將自己喜歡的SWF動畫,當成文章的背景圖了。


 希望您喜歡~~


 


 


 






 

引用:http://tw.myblog.yahoo.com/jw!DLd62O.BHR6udtPKiQygstL33IsbLg--/article?mid=54143

oreokimo 發表在 痞客邦 留言(0) 人氣()


【nkhs9323005漪唲籽潼咿咡緦部落格自訂樣式設定語法→2012/05/12】




【nkhs9323005漪唲籽潼咿咡緦部落格自訂樣式設定語法→2012/05/12】




body {background:url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);}#yblogtitle h1{font-size:100%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0203.gif) no-repeat;padding-left:60px;color:#ff0000;font-family:標楷體;}#yblogtitle .mbd, #yblogtitle .mft{font-size:130%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0203.gif) no-repeat;padding-left:30px;color:#0000ff;font-family:標楷體;}div#btnsbsrb_nologin a, div#btnsbsrb a{display:block;width:88px;height:31px;overflow:hidden;background:url(http://home.educities.edu.tw/nkhs9323005/logo11nkhs9323005.gif) no-repeat;margin:0;}#ymodprf .horos img{display:none;}#ymodprf .horos{width:88px;height:31px;background:url(http://home.educities.edu.tw/nkhs9323005/logo11nkhs9323005.gif) center no-repeat;}.yc3sec .mhd, .yc3subbd .mhd{font-family:標楷體;font-size:100%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0722.gif);color:#ff0000;padding-left:18px;}.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background-image:url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);}.ycntmod .mbd ul.list li {background:url(http://home.educities.edu.tw/nkhs9323005/GIF20040.GIF) left .2em no-repeat;padding-left:20px;margin-bottom:1px;}.yc3pribd .mhd{background:url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);color:#ff0000;}.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p{background-image:url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);color:#000000;}#ymodcal .mbd td strong {color:#ff0000;}.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro more{background-image:url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);}.yblogcnt .blgtitlebar {margin-bottom:5px;zoom:1;}.yc3pribd .mbd, more {font-size:110%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) no-repeat;padding-left:60px;}.yblogcnt .blgtitlebar h2 {background:url(http://home.educities.edu.tw/nkhs9323005/gif0203.gif) no-repeat;padding-left:30px;}#ymodupdate .mbd .date{background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) left center no-repeat;padding-left:60px;font-size:80%;font-family:verdana;}a, a:link, a:visited{color:#ff0000;text-decoration:none;}a:hover{color:#ff0000;}a {text-decoration:none;}a:hover {position:relative;top:2px;left:1.6px;}.ycntmod {width:100%;position:relative;margin-bottom:10px;overflow:hidden;}.ycntmod .rctop {zoom:1;background:left top no-repeat;margin-right:5px;}.ycntmod .rctop div {background:right top no-repeat;height:5px;font-size:0;position:relative;right:-5px;}.ycntmod .rcbtm {zoom:1;background:left bottom no-repeat;margin-right:5px;}.ycntmod .rcbtm div {background:right bottom no-repeat;height:5px;font-size:0;position:relative;right:-5px;}.ycntmod .rcl {padding-left:5px;background:repeat-y;}.ycntmod .rcr {zoom:1;padding-right:5px;background:right repeat-y;}.ycntmod .text {position:relative;word-break:break-all;}.yc3pribd .ycntmod{overflow:visible;}.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}html{scrollbar-face-color:#000000;scrollbar-track-color:#000000;scrollbar-arrow-color:#ff0000;scrollbar-3dlight-color:#ff0000;scrollbar-highlight-color:#ff0000;scrollbar-shadow-color:#ff0000;scrollbar-darkshadow-color:#ff0000;}body{border-right:10px double;border-top:10px double;border-left:10px double;border-bottom:10px double;border-color:#077006;}






Yahoo!奇摩部落格→【自訂樣式參考語法】總覽




Yahoo!奇摩部落格→【自訂樣式參考語法】總覽



/*部落格全版背景底圖設定Background color for whole page*/

body {background: url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif)}



/*部落格橫幅背景底圖設定Background image for blog title*/

#yblogtitle .mbd {background: url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif); background-repeat: repeat}

#yblast{display: none}



/*部落格名稱標題前小圖片與文字字體顏色字體大小變更設定Blog title*/

#yblogtitle h1{font-size:100%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) no-repeat;padding-left:30px; color:#ff0000;font-family:標楷體;}

#yblogtitle .mbd,#yblogtitle .mft{font-size:130%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0203.gif) no-repeat;padding-left:30px; color:#0000ff;font-family:標楷體;}



/*訂閱部落格圖片檔變更設定btnsbsrb*/

div#btnsbsrb_nologin a,div#btnsbsrb a {display:block;width:88px;height:31px;overflow:hidden;background:url(http://home.educities.edu.tw/nkhs9323005/logo11nkhs9323005.gif) no-repeat;margin:0;}



/*招呼語欄位圖框背景底圖變更設定Opacity for blast*/

#yblast .bg {zoom:1; filter:alpha(opacity:100); background: url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif)}



/*部落格自我介紹欄位內容中性別圖片檔變更設定welcome*/

#ymodprf .horos img{display:none;}

#ymodprf .horos{width:100px;height:100px;background:url(http://home.educities.edu.tw/nkhs9323005/gif0255.gif) center no-repeat;}



/*左右欄位標題背景底圖與標題字體顏色設定Nav module header*/

.yc3sec .mhd, .yc3subbd .mhd{font-family:標楷體;font-size:100%;font-weight:bold;background: url(http://home.educities.edu.tw/nkhs9323005/gif0722.gif);color:#ff0000; no-repeat;padding-left:18px;}



/*左右欄位內容中背景底圖設定Nav module body*/

.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{background-image: url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);}



/*左右欄位內容中標題前小圖片變更設定Nav module list*/

.ycntmod .mbd ul.list li {background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) left .2em no-repeat;padding-left:20px;margin-bottom:1px;_margin-bottom:1px;_line-height:1.5em;}

.ycntmod .mbd ul.list li.more {background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) left .2em no-repeat;}



/*中間欄位標題背景底圖與標題字體顏色設定Main content header*/

.yc3pribd .mhd{background:#ffffff url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);color:#ff0000;}



/*中間欄位標題文章內容背景底圖與文章內容文字字體顏色設定Main content body*/

.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p{background-image: url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) no-repeat;

color:#000000} #ymodcal .mbd td strong {color:#ff0000;}

.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro more{background-image: url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif);}



/*中間欄位文章標題前小圖片與文字字體大小變更設定Article content module*/

.yblogcnt .blgtitlebar {margin-bottom:5px;zoom:1;}

.yc3pribd .mbd,more {font-size:110%;font-weight:bold;background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) no-repeat;padding-left:30px;}

.yblogcnt .blgtitlebar h2 {background:url(http://home.educities.edu.tw/nkhs9323005/gif0203.gif) no-repeat;padding-left:30px;}



/*更新日期欄位內容中日期時間前小圖片變更設定Module latest upup*/

#ymodupdate .mbd .date{background:url(http://home.educities.edu.tw/nkhs9323005/gif0005.gif) left center no-repeat;padding-left:16px;font-size:80%;font-family:verdana;}



/*去除文字超連結底線設定Links*/

a,a:link,a:visited{color:#ff0000;text-decoration: none}

a:hover{color:#ff0000;}

a {text-decoration:none}

a:hover {position: relative; top: 2px;left:2px;}



/*去除欄位白色外框設定shared rounded corner for all modules*/

.ycntmod {width:100%;position:relative;margin-bottom:10px;overflow:hidden;}

.ycntmod .rctop {zoom:1;background:url() left top no-repeat;margin-right:5px;}

.ycntmod .rctop div {background:url() right top no-repeat;height:5px;font-size:0;position:relative;right:-5px;}

.ycntmod .rcbtm {zoom:1;background:url() left bottom no-repeat;margin-right:5px;}

.ycntmod .rcbtm div {background:url() right bottom no-repeat;height:5px;font-size:0;position:relative;right:-5px;}

.ycntmod .rcl {padding-left:5px;background:url() repeat-y;}

.ycntmod .rcr {zoom:1;padding-right:5px;background:url() right repeat-y;}

.ycntmod .text {position:relative;word-break:break-all;}

.yc3pribd .ycntmod{overflow:visible;}

.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}



/*捲軸顏色變更設定*/

html{

scrollbar-base-color : #000000;

scrollbar-face-color : #000000;

scrollbar-track-color: #000000;

scrollbar-arrow-color : #ff0000;

scrollbar-3dlight-color: #000000;

scrollbar-highlight-color : #000000;

scrollbar-shadow-color : #000000;

scrollbar-darkshadow-color : #000000;}



/*部落格加顏色外框設定*/

body{

border-right: 10px double;

border-top: 10px double;

border-left: 10px double;

border-bottom: 10px double;

border-color:#077006;

}






Yahoo!奇摩部落格→【自訂樣式參考語法】設定說明




1.本【自訂樣式參考語法】可以直接複製使用

2.直接複製使用本【自訂樣式參考語法】前,

→請先刪除【自訂樣式】內容中的所有語法

3.請在url(http://home.educities.edu.tw/nkhs9323005/gif0415.gif)中,

→做各項背景底圖網址變更設定

4.請在下列訂閱部落格圖片檔變更設定中,做訂閱部落格圖片檔網址變更設定

/*訂閱部落格圖片檔變更設定btnsbsrb*/

div#btnsbsrb_nologin a{display:block;width:88px;height:31px;overflow:hidden;background:url(http://home.educities.edu.tw/nkhs9323005/logo11nkhs9323005.gif) no-repeat;margin:0;}






★【nkhs9323005漪唲籽潼咿咡緦部落格自訂樣式設定語法→2012/05/12】★


http://tw.myblog.yahoo.com/nkhs9323005/article?mid=20087





oreokimo 發表在 痞客邦 留言(0) 人氣()


[語法教學]如何貼圖、貼背景、貼音樂、貼FLASH動畫、貼視頻電影



(注意:此語法需要在編輯窗.....先按 <> 鍵!( 進入源代碼模式 ) 寫入︰以下原本語法!編輯窗.....再按<>鍵發表,才能顯示出來.)




1,HTML貼圖的方法:




貼圖使用統一碼,就是HTML碼,
具體為在張貼頁的內容框裡輸入:<img src="複製圖片絕對地址">

注意:圖片的地址為絕對地址,即後綴名為圖片格式的jpg或gif



需要說明: 絕對地址就是存儲在網絡服務器上的文件的IP地址,這個地址在互聯網上是唯一的,任何人都能夠訪問到它,所以叫做絕對地址。其中"絕對地址"是您所要貼的圖片的網址,比如下面就是一個有效的地址:http://hk.netsh.com/eden/img/upload/2004081112245027023.jpg 而你電腦的硬盤上的文件地址,比如:c:\windows\start.bmp是相對你的電腦來說的,每個人的機器上都有自己的c:\……,所以別人是無法訪問的,這種地址就是相對地址啦。要想在網絡上貼圖片,就必須用絕對地址,這樣它才會正常顯示。硬盤上的圖片,需要上傳到網絡服務器上,得到絕對地址以後,才能在網上應用。



獲取圖片地址的一個最簡單方法:


是在網上發現好的圖片,將鼠標指針放到所選擇的圖片上,點擊右鍵,選擇「屬性」查看地址(URL)得到圖片絕對地址。



例如:在內容框裡輸入: <img src="http://hk.netsh.com/eden/img/upload/2004081112245027023.jpg" >


把以上代碼複製後粘貼到文章發表框內即可




2,貼背景圖的操作方法:




通用代碼:




<body background="這個位置是背景圖片地址,請放入你的背景圖片地址"bgproperties=fixed >




應用舉例:


例如把背景圖片地址:http://hk.netsh.com/eden/img/upload/2004081112245027023.jpg 放在代碼中如下:


<body background="http://hk.netsh.com/eden/img/upload/2004081112245027023.jpg"bgproperties=fixed >


把以上代碼複製後粘貼到文章發表框內即可




3,貼音樂播放器操作方法:




通用代碼:




<EMBED height=70 width=300 src="這個位置是音樂地址,請放入你的音樂地址" type="video/x-ms-wma" autostart="true" showstatusbar="true" controls="ControlPanel" loop="-1" >




應用舉例:


例如把音樂地址地址:http://web.cnpccq.com/person/luotuo/sing/mp3/jyh2.mp3 放在代碼中如下:




<EMBED height=70 width=300 src="http://web.cnpccq.com/person/luotuo/sing/mp3/jyh2.mp3" type="video/x-ms-wma" autostart="true" showstatusbar="true" controls="ControlPanel" loop="-1" >


把以上代碼複製後粘貼到文章發表框內即可




4,貼FLASH動畫操作方法:




通用代碼:




<EMBED pluginspage=http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash src=這個位置是FLASH動畫地址,請放入你的FLASH動畫地址 width=500 height=400 type=application/x-shockwave-flash quality="high"> </EMBED >




應用舉例:


例如把FLASH動畫地址:http://img.piclib.net/swf001/270.swf 放在代碼中如下:

<EMBED pluginspage=http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash src=http://img.piclib.net/swf001/270.swf width=500 height=400 type=application/x-shockwave-flash quality="high"> </EMBED >




把以上代碼複製後粘貼到文章發表框內即可




5,貼音樂播放器操作方法:




通用代碼:




<EMBED src=這個位置是音樂地址,請放入你的音樂地址width=400 height=45 type=audio/mpeg panel="0" autostart="true" loop="true">




應用舉例:


例如把音樂地址:http://218.106.96.251/mov/xiqnchang1.rm 放在代碼中如下:






<EMBED src=http://218.106.96.251/mov/xiqnchang1.rmwidth=400 height=45 type=audio/mpeg panel="0" autostart="true" loop="true">




把以上代碼複製後粘貼到文章發表框內即可




6,貼視頻(圖像)播放器操作方法:




通用代碼:




<EMBED name=Player34 src=這個位置是視頻(圖像)地址,請放入你的視頻(圖像)地址 width=500 height=400 type=application/smil _extentx="9657" _extenty="847" shuffle="0" prefetch="0" nolabels="0" clicktoplay="-1" loop="-1" numloop="0" AutoStart="-1" controls="ImageWindow,StatusBar,ControlPanel"> </EMBED >




應用舉例:


例如把視頻(圖像)地址:http://218.106.96.251/mov/xiqnchang1.rm 放在代碼中如下:




<EMBED name=Player34 src=http://218.106.96.251/mov/xiqnchang1.rm width=500 height=400 type=application/smil _extentx="9657" _extenty="847" shuffle="0" prefetch="0" nolabels="0" clicktoplay="-1" loop="-1" numloop="0" AutoStart="-1" controls="ImageWindow,StatusBar,ControlPanel"> </EMBED >




把以上代碼複製後粘貼到文章發表框內,再按<>發表即可



引用:http://tw.myblog.yahoo.com/jw!Ghq59bGTQU9Byh2yefwKuIM-/article?mid=4538


引用:http://tw.myblog.yahoo.com/jw!6sYUkYKTEUC1XeurrePKNQ--/article?mid=156

oreokimo 發表在 痞客邦 留言(0) 人氣()












貼圖教學:


*首先打開管理部落格 > 管理自訂欄位 >






*自定欄位名稱:(這框裏必須打上你要的題目)


*然後把要貼的語法貼上




<p align="center"><a title="通往你家的路,歡迎再度來訪^0^" style="FONT-WEIGHT:700;" href="http://tw.myblog.yahoo.com/"><img src=" 圖片網址"/></a></p></center>


*然後按儲存 > 按一下版型設定 就可以了。


                                                                 


引用:http://tw.myblog.yahoo.com/jw!RXI5HkuBXhShOd6jZoZE3ow-/article?mid=48645

oreokimo 發表在 痞客邦 留言(0) 人氣()

oreokimo 發表在 痞客邦 留言(0) 人氣()







部落格的背景圖



部落格的背景圖

body {background-image: url(圖片網址); background-repeat: repeat;


background-position: 0% 0%; background-attachment: fixed;}  


語法解說 :





















background-image: url(圖片網址)輸入你要的背景圖網址
background-repeat : repeat圖片重疊並排
或改成background-repeat : no repeat圖片不重疊並排
background-position: 0% 0%圖片位置(依%數調整)
background-attachment: fixed捲軸動圖不動
或改成background-attachment: scroll捲軸動圖亦動








部落格基楚


















部落格的背景圖部落格頂端的背景圖部落格標題的背景圖
部落格招呼欄背景圖部落格自訂欄位內容背景圖部落格文章內容背景圖
自訂欄位標題背景圖文章標題背景圖文章標題前小圖
文章內容前小圖更新日期前小圖部落格圖形變化語法




部落格美化小改款














訂閱部落格圖個人性別圖欄位框圖
滑鼠游標圖去除連結底線欄位去框
設定字型字體各部捲軸顏色版面外框




常用自定欄位


















時鐘衛星雲圖logo
天氣預報溫度時間日期時間
停留時間日曆影音
音樂盒  




其他變化


























標題背景加大招呼欄加大三欄式變化
二欄式版面窄欄靠右加大寬度部落格語法解說(一)部落格語法解說(二)
yahoo奇摩搜尋 網址大公開 跳躍圖~自動翻頁
視 窗 特 效 更換~動畫背景語法板面小變化
圖形變化複製語法音樂盒法語
奇摩部落格語法MP3播放器 隱藏語法

引用:http://tw.myblog.yahoo.com/jw!jgXF17CZFRKy.Ngdc68elgCyNw--/article?mid=1458

oreokimo 發表在 痞客邦 留言(0) 人氣()

















中間文章前小圖設定



更改好的預覽圖↑






如何更改---中間文章前小圖字體色語法如下↓


/*Article content module中間文章前小圖字體色*/
.yblogcnt .blgtitlebar {margin-bottom:10px;}
.yblogcnt .blgtitlebar h2 a {color:#720898;padding-right:5px;}
.yblogcnt .blgtitlebar h2 {font-size:150%;font-weight:bold;background:url(
http://i295.photobucket.com/albums/mm143/carolinetop/ine18.gif ) no-repeat;padding-left:36px;height:20px;padding-top:12px;}


語法註解↓


/*Article content module中間文章前小圖字體色*/
.yblogcnt .blgtitlebar {margin-bottom:10px;}
.yblogcnt .blgtitlebar h2 a {color:#720898;padding-right:5px;}
.yblogcnt .blgtitlebar h2 {font-size:150%;font-weight:bold;background:url(
網址) no-repeat;padding-left:36px;height:20px;padding-top:12px;}


color:#720898 = 字體的顏色


background:url = (圖檔的網址)


padding-right:5px = 邊緣底部距離


font-size:150% = 字體的大小,%比越高字體越大


height:36px = 圖檔的高度

padding-top:12px = 字體的高度

中間文章標題小圖的更改,可尋找自己喜歡的樣式,琳 就先貼幾個讓你做參考














左右欄所有標提前小圖




奇摩預設樣式---更改好預覽圖↑






左右文章標題前小圖括號色設定


/*Nav module list左右文章前小圖括號色*/
.ycntmod .mbd ul.list li {background:url(
http://i234.photobucket.com/albums/ee170/MichelleRuby/oline822.gif ) no-repeat;padding-left:20px;padding-top:5px;color:#B5A592;center;}


語法註解 ↓


/*Nav module list左右文章前小圖括號色*/
.ycntmod .mbd ul.list li {background:url(網址) no-repeat;padding-left:20px;padding-top:5px;color:#B5A592;center;}


background:url = 圖檔網址


no-repeat = 圖檔不重複


left:20px = 圖檔的寬度


padding-top:5px = 字體的高度


color:#B5A592 = 括號顏色






更多回應小圖設定


/*Nav module more更多回應小圖*/
.ycntmod .mbd ul.list li.more {background:url(
http://i234.photobucket.com/albums/ee170/MichelleRuby/oline822.gif ) 30px center no-repeat;}


語法註解 ↓


/*Nav module more更多回應小圖*/
.ycntmod .mbd ul.list li.more {background:url(網址) 30px center no-repeat;}


background:url = 圖檔網址


30px = 字體與圖檔中間空白距離


no-repeat = 圖檔不重複






更新日小圖設定


/*Module latest up更新日小圖*/
#ymodupdate .mbd .date{background:url(
http://i234.photobucket.com/albums/ee170/MichelleRuby/oline822.gif ) left center no-repeat;padding-left:20px;font-size:100%;font-family:verdana;center;}


語法註解 ↓


/*Module latest up更新日小圖*/
#ymodupdate .mbd .date{background:url(網址) left center no-repeat;padding-left:20px;font-size:100%;font-family:verdana;center;}


background:url = 圖檔網址


padding-left = 圖檔與字體的距離


font-size:100% = 圖檔全顯示


置放更改小圖時,要考慮字體,圖檔勿太大,不然是會造成不好看的畫面。


 









置放路線 ↓


複製語法→管理部落格→面板設定→自定樣式→貼上語法→按確定即完成


語法有相同的必須刪除


以上就是----中間文章標題、左右欄所有標題前小圖設定


語法必須不斷的練習與觀看,才能熟悉 ^.^




引用:http://tw.myblog.yahoo.com/jw!YFl.6UmaHk9bFp1B_BIetSfj/article?mid=19495

oreokimo 發表在 痞客邦 留言(0) 人氣()



 













更改訂閱部落格、個人性別圖檔


                  


奇摩預設樣式---未更改↑             更改後的樣式---預覽圖↑     






如何更改---語法如下↓


訂閱部落格圖(自己看不到-請以來賓身分不登入觀看)


/*Subs list訂閱部落格圖(自己看不到-請以來賓身分不登入觀看)*/
div#btnsbsrb a{display:block;width:168px;height:36;pxoverflow:hidden;background:url(http://i234.photobucket.com/albums/ee170/MichelleRuby/oline855.gif ) no-repeat;margin:0;}
div#btnsbsrb_nologin a{display:block;width:168px;height:36px;overflow:hidden;background:url(http://i234.photobucket.com/albums/ee170/MichelleRuby/oline855.gif ) no-repeat;margin:0;}
#yblogtitle .tft {text-align:right;padding-bottom:0px;position:relative;}


語法註解↓


/*Subs list訂閱部落格圖(自己看不到-請以來賓身分不登入觀看)*/
div#btnsbsrb a{display:block;width:168px;height:36;pxoverflow:hidden;background:url(網址 ) no-repeat;margin:0;}
div#btnsbsrb_nologin a{display:block;width:168px;height:36px;overflow:hidden;background:url(網址) no-repeat;margin:0;}
#yblogtitle .tft {text-align:right;padding-bottom:0px;position:relative;}


background:url(圖檔的網址) 


width:168px = 圖檔的寬度


height:36px = 圖檔的高度

PS-------兩個語法網址都要貼相同的 

訂閱圖示的更改,可尋找自己喜歡的樣式,琳 就貼幾個偶製作逗

      

   




                


奇摩預設樣式---未更改↑          更改後的樣式---預覽圖↑    






個人性別圖檔 更改

 

/*更改性別圖示*/
#ymodprf .horos img{display:none;}
#ymodprf .horos{width:110px;height:101px;background:url(http://i295.photobucket.com/albums/mm143/carolinetop/ine19.gif) center no-repeat;}

 

語法註解 ↓

 

/*更改性別圖示*/
#ymodprf .horos img{display:none;}
#ymodprf .horos{width:110px;height:101px;background:url(圖檔網址 ) center no-repeat;}

 

width:110px圖檔的寬度

 

height:44px 圖檔的高度

 

更改個人性別圖時,要考慮欄框的寬度,勿太寬,不然可是會出格,造成不好看的畫面喔。

 

提供幾個樣式做參考↓

 

     




置放路線 ↓

 

複製語法→管理部落格→面板設定→自定樣式→貼上語法→按確定即完成

 

語法有相同的必須刪除,訂閱部落格圖示,自己是看不到的,請以來賓身分不登入觀看

 

以上就是----更改訂閱部落格、個人性別圖檔

 

語法必須不斷的練習與觀看,才能熟悉唷  ^.^

 



oreokimo 發表在 痞客邦 留言(0) 人氣()



 













設定中間上欄最新文章背景、左右標題底圖


奇摩預設樣式---未更改↑



更改後的樣式---預覽圖↑





如何更改---語法如下↓


第一段----中間上欄最新文章字體色


/*Main content header中間上欄最新文章字體色*/
.yc3pribd .mhd{background:url(
http://i295.photobucket.com/albums/mm143/carolinetop/ine07.gif) repeat;TEXT-ALIGN:center;height:50px;color:#FF0000;}


語法註解↓


/*Main content header中間上欄最新文章字體色*/
.yc3pribd .mhd{background:url(圖檔網址) repeat;TEXT-ALIGN:center;height:50px;color:#FF0000;}


background:url(圖檔網址) 


repeat 重複背景,假若妳的圖檔不想重複,就加上no-repeat 就是不重複


TEXT-ALIGN = 字體是否置中,不需要可刪除


height:50px = 圖檔的高度


color:#FF0000 = 最新文章字體色






第二段-----左右文章標題字體色

 

/*Nav module header左右欄標題字體色*/
.yc3sec .mhd, .yc3subbd .mhd, .yc3sec .mhd a, .yc3subbd .mhd a,.yc3sec .mhd a:link, .yc3subbd .mhd a:link,.yc3sec .mhd a:visited, .yc3subbd .mhd a:visited{background:#FFFFFF; color:#FF0000;background-image:url(
http://i234.photobucket.com/albums/ee170/MichelleRuby/oline849.gif );TEXT-ALIGN:center;height:44px;}

 

語法註解 ↓

 

background:#FFFFFF = 設定底圖顏色---不需要也可刪除

 

color:#FF0000  = 左右標題字體色

 

background-image:url(圖檔網址)

 

TEXT-ALIGN =  字體是否置中,不需要可刪除

 

height:44px =  圖檔的高度




以上就是----設定中間上欄最新文章背景、左右標題底圖

 

語法必須不斷的練習與觀看,才能熟悉唷  ^˙^

 



oreokimo 發表在 痞客邦 留言(0) 人氣()




可以放在部落、網頁、無名、Xuite日誌、、等等

裡面還有很多不同滴 postpet 時鐘、、、共有20種


先到這個網站→ http://www.postpet.so-net.ne.jp/webmail/blog/

 選你喜歡的時鐘,複製欄框內語法

將複製好的javascript語法變成一般flash語法





以下↓語法,琳把它修改成可調整尺寸,


適合放於部落格的自定欄位使用↓


原本語法

<script type="text/javascript" src="http://www.postpet.so-net.ne.jp/webmail/blog/clock_v1_furo.js"></script>

修改後的語法↓

<embed src="http://www.postpet.so-net.ne.jp/webmail/blog/clock_v1_furo.swf"width="125" height="130" ></embed> 


語法解說↓



套用語法→ <embed src=" 網址 "width=" 寬 " height=" 高" ></embed>


原本時鐘語法→ <script type="text/javascript" src="網址"></script>


喜歡哪款,只要複製欄框內的網址,貼在套用語法的網址地方 ,

js 改成 swf ,設定你需要的寬高尺寸即可。


尺寸,這裡琳就用寬130高130做為一般的部落尺寸。


想要加寬自定欄位,這裡參考了《 晨曦婆婆 》 怎樣加寬自定欄位法,


這樣時鐘的設定寬高就比較寬不受那小小的拘束。


【手動*定義佈局寬度】三欄位~左右欄寬200


三欄式~欄寬150 語法:(原語法)


/*三欄式*/
.thrcol .yc3main {width:100%;float:left; margin-left:-160px;}
.thrcol .yc3mainbd {margin-left:160px;}
.thrcol .yc3pri {width:100%;float:right;margin-right:-160px;}
.thrcol .yc3pribd {margin-right:160px;}
.thrcol .yc3subbd {width:150px;float:right;}
.thrcol .yc3sec {width:150px;}
.thrcol .yc3sub{z-index:1;}
.thrcol .yc3pri,.thrcol .yc3main{z-index:10;}


三欄式~欄寬200 語法


/*三欄式*/
.thrcol .yc3main {width:100%;float:left; margin-left:-210px;}
.thrcol .yc3mainbd {margin-left:210px;}
.thrcol .yc3pri {width:100%;float:right;margin-right:-210px;}
.thrcol .yc3pribd {margin-right:210px;}
.thrcol .yc3subbd {width:200px;float:right;}
.thrcol .yc3sec {width:200px;}
.thrcol .yc3sub{z-index:1;}
.thrcol .yc3pri,.thrcol .yc3main{z-index:10;}


三欄式~左欄寬150‧右欄寬200 語法


/*三欄式*/
.thrcol .yc3main {width:100%;float:left; margin-left:-210px;}
.thrcol .yc3mainbd {margin-left:210px;}
.thrcol .yc3pri {width:100%;float:right;margin-right:-160px;}
.thrcol .yc3pribd {margin-right:160px;}
.thrcol .yc3subbd {width:200px;float:right;}
.thrcol .yc3sec {width:150px;}
.thrcol .yc3sub{z-index:1;}
.thrcol .yc3pri,.thrcol .yc3main{z-index:10;}


三欄式~左欄寬200‧右欄寬150 語法



/*三欄式*/
.thrcol .yc3main {width:100%;float:left; margin-left:-160px;}
.thrcol .yc3mainbd {margin-left:160px;}
.thrcol .yc3pri {width:100%;float:right;margin-right:-210px;}
.thrcol .yc3pribd {margin-right:210px;}
.thrcol .yc3subbd {width:150px;float:right;}
.thrcol .yc3sec {width:200px;}
.thrcol .yc3sub{z-index:1;}
.thrcol .yc3pri,.thrcol .yc3main{z-index:10;}



【手動*定義佈局寬度】二欄式


兩欄位~窄欄寬150 語法:(原語法)


/*兩欄式 - 窄欄靠右*/
.twocolga .yc3main {width:100%;float:left; margin-left:-160px;}
.twocolga .yc3mainbd {margin-left:160px;}
.twocolga .yc3pri {width:100%;}
.twocolga .yc3subbd {width:150px;float:right;}
.twocolga .yc3sec {display:none;} /*in case there's content*/


/*兩欄式 - 窄欄靠左*/
.twocoldr .yc3main {width:100%;float:right; margin-right:-160px;}
.twocoldr .yc3mainbd {margin-right:160px;}
.twocoldr .yc3pri {width:100%;}
.twocoldr .yc3subbd {width:150px;}
.twocoldr .yc3sec {display:none;} /*in case there's content*/


兩欄位~窄欄寬200 語法


/*兩欄式 - 窄欄靠右*/
.twocolga .yc3main {width:100%;float:left; margin-left:-210px;}
.twocolga .yc3mainbd {margin-left:210px;}
.twocolga .yc3pri {width:100%;}
.twocolga .yc3subbd {width:200px;float:right;}
.twocolga .yc3sec {display:none;} /*in case there's content*/


/*兩欄式 - 窄欄靠左*/
.twocoldr .yc3main {width:100%;float:right; margin-right:-210px;}
.twocoldr .yc3mainbd {margin-right:210px;}
.twocoldr .yc3pri {width:100%;}
.twocoldr .yc3subbd {width:200px;}
.twocoldr .yc3sec {display:none;} /*in case there's content*/




以下語法↓適合網頁、無名、Xuite日誌、、、等等



原本的語法↓



<script type="text/javascript" src="http://www.postpet.so-net.ne.jp/webmail/blog/clock_v1_furo.js "></script>




修改後的語法↓


<embed src="http://www.postpet.so-net.ne.jp/webmail/blog/clock_v1_furo.swf "></embed>




只要套用語法  將改 js swf 就可以了。


※看清楚唷,上頭↑這個沒有寬高設定,所以不適合部落格喔※



 



 


oreokimo 發表在 痞客邦 留言(0) 人氣()
















中間最新文章『下欄』內文設底圖外圍設虛線


+++++++++++++++++++++++++++++++++++++++++++




 


此段是奇摩本身最新文章內文語法↓


/*Main content body中間最新文章內文語法*/
.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p{
background:#D9D9D9;color:#333} #ymodcal .mbd td strong {color:#fff;}


以下的設定,分段設語法,每增加或減少語法,都有不同變化。請看註解: ↓


 


現在把語法做個變化↓


/*Main content body中間最新文章下欄內文設底圖外圍設虛線*/
.yc3pribd .mbd{font-size:120%;background:url(網址
); #ffffff;color:#000000;border:6px dotted #9A0000;}
.yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p {background:transparent;color:#000000;}




語法註解: ↓

font-size:120%←內文字體尺寸

;background:url( 網址 ) ; #ffffff ←內文加上底圖


#ffffff是沒放底圖文章的底色


;color:#000000←內文字體顏色


;border:6px dotted #9A0000;} ←設定外圍虛線顏色  →6px虛線尺寸


{background:transparent;color:#000000;} ← 部落格檔案、個人資料字體顏色



不放底圖直接使用色碼顏色↓

/*Main content body中間最新文章下欄內文設定語法*/
.yc3pribd .mbd{font-size:120%;background:#ffffff;color:#000000;border:6px dotted #9A0000;}
.yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p {background:transparent;color: #000000;}


語法註解:↓



font-size:120%;←字體大小

background:#ffffff ←內文底色


;color:#000000 ←內文字體色


;border:6px dotted #9A0000 ← 外圍虛線色  6px→虛線尺寸


{background:transparent;color:#000000;}←部落格檔案、個人資料字體顏色



當我們設定好外圍虛線後,


虛線的外圍還有一層框線,如何消除?只要加上下面這段語法↓


/*shared rounded corner for all modules 左右中間欄無框語法*/
.ycntmod {width:100%;position:relative;margin-bottom:1px;overflow:hidden;}
.ycntmod .rctop {background:left top no-repeat;margin-right:0px;}
.ycntmod .rctop div {background:right top no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcbtm {background:left bottom no-repeat;margin-right:0px;}
.ycntmod .rcbtm div {background:right bottom no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcl {padding-left:0px;background:repeat-y;}
.ycntmod .rcr {padding-right:0px;background:right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}






 


↑這張的預覽圖是全部中間最新文章設定好的成果,總語法如下↓


/*Main content header中間最新文章上欄標題底圖+虛線顏色+文字置中*/
.yc3pribd .mhd{font-size:120%;background:url(
網址) 50%  repeat;height:70px;color:#000000;border:6px dotted #9A0000;TEXT-ALIGN: center;}


/*Main content body中間最新文章下欄內文設底圖外圍設虛線*/
.yc3pribd .mbd{font-size:120%;background:url(網址); #ffffff;color:#000000;border:6px dotted #9A0000;}
.yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p {background:transparent;color:#000000;}


/*shared rounded corner for all modules 左右中間欄無框語法*/
.ycntmod {width:100%;position:relative;margin-bottom:1px;overflow:hidden;}
.ycntmod .rctop {background:left top no-repeat;margin-right:0px;}
.ycntmod .rctop div {background:right top no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcbtm {background:left bottom no-repeat;margin-right:0px;}
.ycntmod .rcbtm div {background:right bottom no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcl {padding-left:0px;background:repeat-y;}
.ycntmod .rcr {padding-right:0px;background:right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}









 





紫蘿琳 隨藝坊 http://tw.myblog.yahoo.com/jw!YFl.6UmaHk9bFp1B_BIetSfj/profile

oreokimo 發表在 痞客邦 留言(0) 人氣()
















中間最新文章『上欄』加入底圖外圍設定虛線顏色


  



  

此段是奇摩本身最新文章上欄標題語法↓


/*Main content header*/


 .yc3pribd .mhd{background:#B9D449;color:#333333;}


以下的設定,分段設語法,每增加或減少語法,都有不同變化。請看註解:↓


 


現在把語法做個變化  ↓


/*Main content header中間最新文章上欄標題底色+虛線顏色+文字置中*/
.yc3pribd .mhd{font-size:120%;background-color:#ffffff;color:#000000;border:6px dotted #9A0000;text-align:center;}


語法註解: ↓


font-size:120%←最新文章字體尺寸


background-color:#ffffff ←上欄底色


;color:#000000 ←最新文章字體色


;border:6px dotted #9A0000←外圍虛線色 6px→虛線尺寸


;TEXT-ALIGN: center ←最新文章文字置中→此段不想讓文字置中可刪除


 


此段語法 ↓上欄標題加入圖檔


/*Main content header中間最新文章上欄標題加入圖檔設定虛線顏色*/
.yc3pribd .mhd{font-size:120%;background:url(
網址) repeat;color:#000000;border:6px dotted #9A0000;TEXT-ALIGN: center;}


語法註解: ↓


font-size:120%  →最新文章字體大小


;background:url(圖檔網址) 放入任何適合的圖檔


repeat →重複底圖,假如你的圖檔過寬則可加入 no-repeat 就是不重複底圖


color:#000000 → 最新文章字樣色


;border:6px dotted #9A0000 → 外圍虛線色 ── 6px 是虛線尺寸


;TEXT-ALIGN:center → 最新文章文字置中 ── 不想讓文字置中可刪除此段




設定好虛線跟圖檔


更外圍還有一層框線,該如何刪除?只要加入下列語法↓


/*shared rounded corner for all modules 中間欄無框語法*/
.ycntmod {width:100%;position:relative;margin-bottom:1px;overflow:hidden;}
.ycntmod .rctop {background:left top no-repeat;margin-right:0px;}
.ycntmod .rctop div {background:right top no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcbtm {background:left bottom no-repeat;margin-right:0px;}
.ycntmod .rcbtm div {background:right bottom no-repeat;height:0px;font-size:0;position:relative;right:-0px;}
.ycntmod .rcl {padding-left:0px;background:repeat-y;}
.ycntmod .rcr {padding-right:0px;background:right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}


 


上頭這張的圖檔是寬的標題圖,把它拿來當上欄圖,也很適合


/*Main content header中間最新文章上欄加入底圖外圍設定虛線顏色*/
.yc3pribd .mhd{font-size:120%;background:url(
網址) 50%  repeat;height:70px;color:#000000;border:6px dotted #9A0000;TEXT-ALIGN: center;}


語法註解: ↓


font-size:120% ←最新文章字體尺寸


background:url( 圖檔 ) ←底圖網址


50%  repeat ←圖檔左右移動 0% 顯示圖檔左側 100%顯示圖檔右側


 而你的圖檔若是自製或剛剛好符合標題尺寸,把50%  repeat改成→no-repeat 不重複,假若圖檔過小,把no刪除,變成repeat 就是重複的圖檔


;height:70px ← 圖檔尺寸


;color:#000000 ← 最新文章字體顏色


border:6px dotted #9A0000 ← 外圍虛線顏色 6px→虛線尺寸


;TEXT-ALIGN: center ← 最新文章文字置中→此段不想讓文字置中可刪除







虛線設定方面,琳,尺寸設成6px是要讓各位看的清楚點,

一般的設定大概在1~~2px就行了



紫蘿琳 隨藝坊 http://tw.myblog.yahoo.com/jw!YFl.6UmaHk9bFp1B_BIetSfj/profile


oreokimo 發表在 痞客邦 留言(0) 人氣()













































捲軸設定~ 範例語法




HTML {scrollbar-face-color: #306EFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #3BB9FF;
scrollbar-darkshadow-color: #2B60DE;
scrollbar-shadow-color: #1589FF;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #3BB9FF;}




HTML{scrollbar-face-color: #E6A9EC;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #D2B9D3;
scrollbar-darkshadow-color: #C38EC7;
scrollbar-shadow-color: #D462FF;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #F9B7FF;}




HTML{scrollbar-face-color: #FBB917;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #FDD017;
scrollbar-darkshadow-color: #F87217;
scrollbar-shadow-color: #F88017;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #FDD017;}



 

HTML{scrollbar-face-color: #FAAFBE;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #FBBBB9;
scrollbar-darkshadow-color: #F660AB;
scrollbar-shadow-color: #F9A7B0;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #FAAFBA;}




HTML{scrollbar-face-color: #00FF00;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #87F717;
scrollbar-darkshadow-color: #59E817;
scrollbar-shadow-color: #5FFB17;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #C3FDB8;}




HTML{scrollbar-face-color:#ff9999;
scrollbar-highlight-color:#FFFFFF;
scrollbar-3dlight-color:#ff6666;
scrollbar-darkshadow-color:#ff6666;
scrollbar-shadow-color:#FFFFFF;
scrollbar-arrow-color:#ffffff;
scrollbar-track-color:#ffcccc;}




HTML{scrollbar-face-color:#999966;
scrollbar-highlight-color:#FFFFFF;
scrollbar-3dlight-color:#999900;
scrollbar-darkshadow-color:#999900;
scrollbar-shadow-color:#FFFFFF;
scrollbar-arrow-color:#ffffff;
scrollbar-track-color:#cccc99;}




HTML{scrollbar-face-color:#9999ff;
scrollbar-highlight-color:#FFFFFF;
scrollbar-3dlight-color:#6633cc;
scrollbar-darkshadow-color:#6633cc;
scrollbar-shadow-color:#FFFFFF;
scrollbar-arrow-color:#ffffff;
scrollbar-track-color:#ccccff;}




HTML{scrollbar-face-color: #DAE8F7;
scrollbar-highlight-color: #ffffff;
scrollbar-shadow-color: #ffffff;
scrollbar-3dlight-color: #5F9FE0;
scrollbar-arrow-color: #5F9FE0;
scrollbar-track-color: #ffffff;
scrollbar-darkshadow-color: #5F9FE0;}




HTML{scrollbar-face-color:#ffccff;
scrollbar-highlight-color:#FFFFFF;
scrollbar-3dlight-color:#ff66ff;
scrollbar-darkshadow-color:#ff66ff;
scrollbar-shadow-color:#ff66ff;
scrollbar-arrow-color:#ff66ff;
scrollbar-track-color:#ffccff;}




HTML{scrollbar-face-color:#FABD05;
scrollbar-highlight-color:#F5E069;
scrollbar-3dlight-color:#FAF4D8;
scrollbar-darkshadow-color:#F9D073;
scrollbar-shadow-color:#E39A37;
scrollbar-arrow-color:#FFFFFF;
scrollbar-track-color:#ffffff;}




HTML{scrollbar-face-color: black;
scrollbar-shadow-color: ff0000;  
scrollbar-highlight-color: black;
scrollbar-3dlight-color: ff0000;
scrollbar-darkshadow-color: black;
scrollbar-track-color: black;
scrollbar-arrow-color: ff0000;}




HTML{scrollbar-face-color: black;
scrollbar-shadow-color: 999966;  
scrollbar-highlight-color: black;
scrollbar-3dlight-color: 999966;
scrollbar-darkshadow-color: black;
scrollbar-track-color: black;
scrollbar-arrow-color: 999966;}




HTML{scrollbar-face-color:#FFB9DC;
scrollbar-highlight-color:#FF82C0;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
scrollbar-shadow-color:#800080;
scrollbar-arrow-color:#FF0080;
scrollbar-track-color:#FFD5EA;}




HTML{scrollbar-face-color:#ececff;
scrollbar-highlight-color:#8080FF;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
scrollbar-shadow-color:#0000A0;
scrollbar-arrow-color:#0000FF;
scrollbar-track-color:#f2f2ff;}




HTML{scrollbar-face-color: ffffff;
scrollbar-shadow-color: 00cc00;  
scrollbar-highlight-color: ffffff;
scrollbar-3dlight-color: 00cc00;
scrollbar-darkshadow-color: 00e600;
scrollbar-track-color: d7ffd7;
scrollbar-arrow-color: 00cc00;}




HTML{scrollbar-face-color: #6586B1;
scrollbar-shadow-color: #E8EFF2;  
scrollbar-highlight-color: #E8EFF2;
scrollbar-3dlight-color: #6586B1;
scrollbar-darkshadow-color: #6586B1;
scrollbar-track-color: #6586B1;
scrollbar-arrow-color: #E8EFF2;}




HTML{scrollbar-face-color:#CDC9AC;
scrollbar-highlight-color:#D0CAB1;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-darkshadow-color:#655A38;
scrollbar-shadow-color:#757544;
scrollbar-arrow-color:#FFFFFF;
scrollbar-track-color:#CEC395;}




HTML{scrollbar-arrow-color: #74A47F;
scrollbar-shadow-color: #74A47F;
scrollbar-highlight-color: #74A47F;
scrollbar-darkshadow-color: #74A47F;
scrollbar-track-color: #FFFFFF;
scrollbar-face-color: #E1F3E5;}




HTML{scrollbar-face-color: #004080;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: Black;
scrollbar-darkshadow-color: Black;
scrollbar-shadow-color: #FFFFFF;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #003162;}




HTML{scrollbar-face-color:#800000;
scrollbar-highlight-color:#FF0000;
scrollbar-3dlight-color:#800000;
scrollbar-darkshadow-color:#800000;
scrollbar-shadow-color:#FF0000;
scrollbar-arrow-color:#ECC977;
scrollbar-track-color:#800000;}



以上就是捲軸顏色的示範與語法



使用在自訂樣式裡,更改部落格捲軸顏色


如何使用,複製語法↓


點按→管理部落格→面板設定→自訂樣式→將捲軸語法放在最下面


本身有設定其它捲軸語法必須先刪除或覆蓋,點按確定及完成捲軸設定




紫蘿琳 隨藝坊 http://tw.myblog.yahoo.com/jw!YFl.6UmaHk9bFp1B_BIetSfj/profile



 


oreokimo 發表在 痞客邦 留言(0) 人氣()


 

 















招呼語設定語法整理

 


 

更多的語法設定請參考→ 語法記錄 

招呼語設定的預覽圖↓



奇摩預設樣式---未更改↑


/*Opacity for blast奇摩本身的招呼語設定*/
#yblast .bg {zoom:1; filter:alpha(opacity:100); background: url(http://tw.yimg.com/i/tw/blog/yimg/blast_bg4.gif ) no-repeat}



  更改後的樣式---預覽圖↑     







如何更改---語法如下↓


/*Opacity for blast招呼語字體顏色圖框置中*/
#yblast .text{color:#F4F4F4;}
#yblast{text-align:center}
#yblast .text{font-size:14px;font-weight:bolder}
#yblast .bg{background-image:url(http://i438.photobucket.com/albums/qq110/carolinepoppy/oline213.gif);background-repeat:no-repeat; background-position:50% 80%;width:540px;height:66px}


 語法註解↓


/*Opacity for blast招呼語字體顏色圖框置中*/
#yblast .text{color:#F4F4F4;}
#yblast{text-align:center}
#yblast .text{font-size:14px;font-weight:bolder}
#yblast .bg{background-image:url(網址);background-repeat:no-repeat; background-position:50% 80%;width:540px;height:66px}


color:#F4F4F4 = 字體顏色


#yblast{text-align:center} = 字體置中


font-size:14px = 字體的尺寸


background-image:url = (圖檔的網址)


no-repeat = 圖檔不重複


position:50% 80% =  ↓


第一個50%=圖檔左右移動


(100%圖檔往右移)(0%圖檔往左移)(50%在中間)


第二80%=招呼語圖下邊緣與中間最新文章距離


(100%就緊貼最新文章→ 0%越低圖檔往上)


width:540px = 圖檔的寬度


height:66px = 圖檔的高度







招呼語若不想設定圖檔只想以文字代替,那麼就參考以下語法↓


/*招呼語色+調整高度+置中+字體大小*/
#yblast .bg {background: transparent no-repeat}
#yblast .text{color:#ffffff;padding-top:30px;}
#yblast{text-align:center}
#yblast .text{font-size:14px;font-weight:bolder}


 語法註解 ↓


color:#ffffff = 字體顏色


top:30px = 字體與標題距離,數字越大距離越高


#yblast{text-align:center} = 字體置中,不想置中可刪除


font-size:15px = 字體的大小,數字調高字體越大

-----------------------------------------------------------------

不想設定字體的高度、置中讓奇摩預設決定↓

 /*招呼語字體顏色*/
#yblast .bg {background: transparent no-repeat}
#yblast .text{color:#000000;}

/*字體大小↑*/
#yblast .text{font-size:14px;font-weight:bolder}







以上三種設定語法,還可再加上這段↓


/*隱藏招呼語(我要留言)*/
#yblast .text a{display:none;}







 或是你想把(招呼語我要留言)換圖嗎?請參考以下↓


ㄚ! 設定這段,只有自己看的到啦!


/*招呼語我要留言換圖(自己才看得到)*/
#yblast a.edit{background:url(http://i234.photobucket.com/albums/ee170/MichelleRuby/caroline03-217.gif );width:35px;height:27px;}


我要留言換圖→圖檔不宜過大,一般我們設定左右欄小圖的即可。 








再來~~~~最後嚕,若是你不想顯示招呼語,那麼就乾脆給它用隱藏滴↓


/*隱藏招呼語*/
#yblast{display:none;}


---------------------------------------------------------


以上就是招呼語設定的語法整理

招呼語圖示的更改,可尋找自己喜歡的樣式,琳 就貼幾個偶製作逗


更多的圖檔請參考→  隨藝創作








 






設定路線→複製語法→點按管理部落格→面板樣式→自訂樣式→清除自訂樣式原語法,

在將語法貼上,按確定即完成設定


紫蘿琳 隨藝妨 http://tw.myblog.yahoo.com/jw!YFl.6UmaHk9bFp1B_BIetSfj/profile




 


 


 


※ 引用發表複製 ↑ 框內即可。
如你不想上傳,此張↓是上傳樣板,請勿【千萬】別用複製,
必須【絕對】要另存目標至你的電腦在上傳發表。
 
※ 如何上傳樣版圖----↓
只要對著下面這張樣版圖,按右鍵→點選另存圖片→
在來記好文章標題→複製文章內容→按我要引用--
回到妳發表地方後,先點選-----選擇相片--從我的電腦中挑選--
寫好相片編號或名稱--瀏覽你要上傳的圖檔---確定上傳完後會回到編輯地方,
將所複製的文章內容貼上----填寫上文章標題----文章分類------在按立即發表即完成。




引用:http://tw.myblog.yahoo.com/jw!WU7UXoSZFhZ5UNTl1VkiGQ--/article?mid=54523

oreokimo 發表在 痞客邦 留言(0) 人氣()



 



*網頁超連結

語法說明:
















/*主題*/內容標題{常用修改樣式}
/*Links網頁超連結*/a,a:link,a:visited
(原始超連結文字)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
background-color:#FFFFFF(文字背景顏色)
position:relative;top:2px;left:2px(文字位移數值)
text-decoration:none(刪除底線)
a:hover
(滑鼠經過時變化)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
background-color:#FFFFFF(文字背景顏色)
background-image:url(http://圖檔網址.gif)(文字背景圖檔)
border:1px dotted #FFFFFF(文字點狀框線)
position:relative;top:2px;left:2px(文字位移數值)
text-decoration:none(刪除底線)


 


範例:


/*Links網頁超連結*/
a,a:link,a:visited{color:#6600CC;text-decoration:none}
a: hover{color:#FFFF00;background-image:url(http://圖檔網址.gif);background- repeat:repeat;border:1px dotted #6600CC;position:relative;top:1px;left:1px}


 



*部落格背景


語法說明:


 












/*主題*/內容標題{常用修改樣式}
/*Background部落格背景*/body
(整個部落格背景)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-attachment:fixed(背景固定不動)
background-repeat:repeat(背景重複排列)
background-repeat:no-repeat(單一背景不重複)
background-repeat:repeat-x(背景在x軸重複排列)
background-repeat:repeat-y(背景在y軸重複排列)
background-position:0% 0%(單一背景在x與y軸的位置)
border:10px double #FFFFFF(背景加雙框線)

 


範例:


/*Background部落格背景*/
body{background-color:#9966FF;background-image:url(http://圖檔網址.gif);background-attachment:fixed}


 



*奇摩置頂欄


語法說明:


 





















/*主題*/內容標題{常用修改樣式}
/*Master header奇摩置頂欄*/#yhtw_masthead
(整列置頂欄)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-weight:bold(文字粗體)
border:3px double #FFFFFF(背景加雙框線)
filter:alpha(opacity=50)(背景透明度)
#yhtw_masthead .mhlogo
(部落格logo)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
border:3px double #FFFFFF(背景加雙框線)
font-family:新細明體(文字字型)
#yhtw_masthead .mhuser
(您好會員登出會.....)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
border:3px double #FFFFFF(背景加雙框線)
font-family:新細明體(文字字型)
#yhtw_masthead .mhsch
(請選擇功能服務.....)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
border:3px double #FFFFFF(背景加雙框線)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
filter:alpha(opacity=50)(背景透明度)

 


範例:


/*Master header奇摩置頂欄*/
#yhtw_masthead{display:none}


 



*奇摩置底欄


語法說明:


 












/*主題*/內容標題{常用修改樣式}
/*Master foot奇摩置底欄*/#yhtw_mastfoot
(整列置底欄)
display:none(不顯示)

 


範例:


/*Master foot奇摩置底欄*/
#yhtw_mastfoot{display:none}


 



*主標題欄位


語法說明:


 
























/*主題*/內容標題{常用修改樣式}
/*Blog title主標題欄位*/#yblogtitle .mbd
(整個主標題欄)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:3px double #FFFFFF(背景加雙框線)
text-align:center(文字位置)
zoom:1;filter:alpha(opacity:0)(背景透明度)
#yblogtitle .mbd .thd
(主標題文字)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:3px double #FFFFFF(背景加雙框線)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
text-align:center(文字位置)
width:60px; height:60px(欄位尺寸)
#yblogtitle h1
(主標題文字超連結)
display:block; float:left(以圖檔為超連結)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
color:#FFFFFF(字體顏色)
font-weight:bold(文字粗體)
text-align:center(文字位置)
width:60px; height:60px(欄位尺寸)
#yblogtitle .mbd .tbd
(描述文字)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:3px double #FFFFFF(背景加雙框線)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
#yblogtitle .rctop,
#yblogtitle .rctop div,
#yblogtitle .rcl,
#yblogtitle .rcr,
#yblogtitle .rcbtm,
#yblogtitle .rcbtm div
(整欄及框線)
zoom:1;filter:alpha(opacity:0)(背景透明度)

 


範例:


/*Blog title主標題欄位*/
#yblogtitle .mbd{text-align:center}
#yblogtitle .mbd .thd{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat; background-position:0% 100%;width:380px;height:45px;font-size:16px;text-align:right}
#yblogtitle h1{color:#FFFFFF;font-weight:bold}
#yblogtitle .mbd .tbd{display:none}
#yblogtitle .rctop,#yblogtitle .rctop div,#yblogtitle .rcl,#yblogtitle .rcr,#yblogtitle .rcbtm,#yblogtitle .rcbtm div{zoom:1;filter:alpha(opacity:0)}


 



*招呼語欄


語法說明:


 


















/*主題*/內容標題{常用修改樣式}
/*Blog blast module招呼語欄位*/#yblast
(整個招呼語欄)
text-align:center(文字位置)
filter:alpha(opacity=50)(背景透明度)
#yblast .bg
(招呼語欄背景)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:10px double #FFFFFF(背景加雙框線)
filter:alpha(opacity=50)(背景透明度)
width:60px; height:60px(欄位尺寸)
#yblast .text
(招呼語文字)
display:none(不顯示)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
filter:alpha(opacity=50)(背景透明度)

 


範例:


/*Blog blast module招呼語欄位*/
#yblast{text-align:right}
#yblast .bg{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat;width:150px;height:30px}
#yblast .text{font-size:10px}


 



*文章欄


語法說明:


 





















/*主題*/內容標題{常用修改樣式}
/*Article文章寬欄位*/.yc3pribd .mhd
(文章標題欄)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:10px double #FFFFFF(背景加雙框線)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
filter:alpha(opacity=50)(背景透明度)
.yc3pribd .mbd
(文章內容欄)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-attachment:fixed(背景固定不動)
background-repeat:repeat(背景重複排列)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:10px double #FFFFFF(背景加雙框線)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
zoom:1;filter:alpha(opacity:0)(背景透明度)
.blgtitlebar h2
(文章內容標題)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:10px double #FFFFFF(背景加雙框線)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
zoom:1;filter:alpha(opacity:0)(背景透明度)
.yc3pribd .rctop,
.yc3pribd .rctop div,
.yc3pribd .rcl,
.yc3pribd .rcr,
.yc3pribd .rcbtm,
.yc3pribd .rcbtm div
(整欄及框線)
zoom:1;filter:alpha(opacity:0)(背景透明度)

 


範例:


/*Article文章寬欄位*/
.yc3pribd .mhd{display:none}
.yc3pribd .mbd{color:#6600CC;font-size:10px;zoom:1;filter:alpha(opacity:0)}
.blgtitlebar h2{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat;color:#FFFF00;padding-left:30px}
.yc3pribd .rctop,.yc3pribd .rctop div,.yc3pribd .rcl,.yc3pribd .rcr,.yc3pribd .rcbtm,.yc3pribd .rcbtm div{zoom:1;filter:alpha(opacity:0)}


 



*左右窄欄


語法說明:


 



























/*主題*/內容標題{常用修改樣式}
/*Blog category list module左右窄欄位*/.yc3sec .mhd,.yc3sub .mhd
(左右上標欄)
display:none(不顯示)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:repeat(背景重複排列)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:10px double #FFFFFF(背景加雙框線)
filter:alpha(opacity=50)(背景透明度)
.yc3sec .mhd h3,.yc3sub .mhd h3
(左右欄標題文字)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
zoom:1;filter:alpha(opacity:0)(背景透明度)
.yc3sec .mbd,.yc3sub .mbd
(左右欄內容)
background-color:#FFFFFF(背景顏色)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:repeat(背景重複排列)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
text-align:center(文字位置)
zoom:1;filter:alpha(opacity:0)(背景透明度)
.ycntmod .mbd ul.list li
(標前圖示)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
padding-left:25px(標題位移數值)
_line-height:1.5em(標題行距倍數)
.ycntmod .mbd ul.list li.more
(所有文章及更多回應)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
.yc3sec .rctop,
.yc3sec .rctop div,
.yc3sec .rcl,
.yc3sec .rcr,
.yc3sec .rcbtm,
.yc3sec .rcbtm div,
.yc3sub .rctop,
.yc3sub .rctop div,
.yc3sub .rcl,
.yc3sub .rcr,
.yc3sub .rcbtm,
.yc3sub .rcbtm div
(整欄及框線)
zoom:1;filter:alpha(opacity:0)(背景透明度)

 


範例:


/*Blog category list module左右窄欄位*/
.yc3sec .mhd,.yc3sub .mhd{filter:alpha(opacity=0)}
.yc3sec .mhd h3,.yc3sub .mhd h3{background:url(http://圖檔網址.gif);background-repeat:no-repeat;color: #FFFFFF;font-weight:bold;font-size:12px;padding-left:25px;padding-top:5px}
.yc3sec .mbd,.yc3sub .mbd{color:#6600CC;font-size:10px;zoom:1;filter:alpha(opacity:0)}
.ycntmod .mbd ul.list li{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat; padding-left:25px;padding-top:10px;_line-height:1.5em}
.ycntmod .mbd ul.list li.more{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat}
.yc3sec .mhd a:visited,.yc3subbd .mhd a:visited{color:#FFFFFF}


 



*欄位框線圖


語法說明:


 



























/*主題*/內容標題{常用修改樣式}
/*Shared rounded corner for all modules欄位框線圖*/.ycntmod .rctop
(框線左上角)
background:url(http://圖檔網址.gif) left top no-repeat(左上框線圖檔)
margin-right:8px(右邊位移數值)
.ycntmod .rctop div
(框線右上角)
background:url(http://圖檔網址.gif) right top no-repeat(右上框線圖檔)
height:30px (上方圖檔高度)
right:8px(圖檔位移數值)
.ycntmod .rcl
(框線左直線)
background:url(http://圖檔網址.gif) repeat-y(左直框線圖檔)
.ycntmod .rcr
(框線右直線)
background:url(http://圖檔網址.gif) right repeat-y(右直框線圖檔)
.ycntmod .rcbtm
(框線左下角)
background:url(http://圖檔網址.gif) left bottom no-repeat(左下框線圖檔)
margin-right:8px(右邊位移數值)
.ycntmod .rcbtm div
(框線右下角)
background:url(http://圖檔網址.gif) right bottom no-repeat(右下框線圖檔)
height:30px (上方圖檔高度)
right:8px(圖檔位移數值)

 


範例:


/*Shared rounded corner for all modules欄位框線圖*/
.ycntmod .rctop{background:url(http://左上圖檔網址.gif) left top no-repeat;margin-right:20px}
.ycntmod .rctop div{background:url(http://右上圖檔網址.gif) right top no-repeat;height:20px;right:-20px}
.ycntmod .rcl{background:url(http://左直圖檔網址.gif) repeat-y}
.ycntmod .rcr{background:url(http://右直圖檔網址.gif) right repeat-y}
.ycntmod .rcbtm {zoom:1;background:url(http://左下圖檔網址.gif) left bottom no-repeat;margin-right:20px}
.ycntmod .rcbtm div {background:url(http://右下圖檔網址.gif) right bottom no-repeat;height:20px;right:-20px}


註:左右窄欄位的預設寬度為width:140px,設定為120px較不會影響框線


 



*捲軸


語法說明:


 












/*主題*/內容標題{常用修改樣式}
/*Scrollbar捲軸區色彩*/html
(網頁主體)
scrollbar-face-color:#FFFFFF(捲軸的軸面顏色)
scrollbar-track-color:#FFFFFF(捲軸的軸軌顏色)
scrollbar-3dlight-color:#FFFFFF(捲軸立體邊左上暗顏色)
scrollbar-highlight-color:#FFFFFF(捲軸立體邊左上亮顏色)
scrollbar-shadow-color:#FFFFFF(捲軸立體邊右下亮顏色)
scrollbar-darkshadow-color:#FFFFFF(捲軸立體邊右下暗顏色)
scrollbar-arrow-color:#FFFFFF(捲軸上下三角型顏色)

 


範例:


/*Scrollbar捲軸區色彩*/
html{scrollbar-face-color:#9470DB;scrollbar-track-color:#C48AFF;scrollbar-3dlight-color:#AB57FF;scrollbar-highlight-color:#6B00D6;scrollbar-shadow-color:#AB57FF;scrollbar-darkshadow-color:#6B00D6;scrollbar-arrow-color:#7800F0}


 



*自我介紹


語法說明:


 
























/*主題*/內容標題{常用修改樣式}
/*Profile自我介紹欄*/#ymodprf
(整個自我介紹欄)
display:none(不顯示)
filter:alpha(opacity=50)(背景透明度)
#yprf
(個人相片)
display:none(不顯示)
#ymodprf .nickname
(個人暱稱)
display:none(不顯示)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
#ymodprf .horos
(個人星座)
display:none(不顯示)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
color:#FFFFFF(字體顏色)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
font-weight:bold(文字粗體)
text-align:center(文字位置)
width:140px; height:60px(欄位尺寸)
#ymodprf .horos img
(性別小圖示)
display:none(不顯示)

 


範例:


/*Profile自我介紹欄*/
#yprf{display:none}
#ymodprf .nickname{font-size:12px;font-weight:bold;filter:alpha(opacity:0)}
#ymodprf .horos{background-image:url(http://圖檔網址.gif);background-repeat:no- repeat;background-position:0% 50%;color:#FFFFFF;width:40px; height:50px}
#ymodprf .horos img{display:none}


 



*更新日期


語法說明:


 















/*主題*/內容標題{常用修改樣式}
/*Blog latest update module更新日期欄*/#ymodupdate
(整個更新日期欄)
display:none(不顯示)
filter:alpha(opacity=50)(背景透明度)
#ymodupdate .mbd .date
(日期欄)
background-color:#FFFFFF(文字背景顏色)
background-image:url(http://圖檔網址.gif)(文字背景圖檔)
zoom:1;filter:alpha(opacity:0)(背景透明度)
padding-top:10px(日期位移數值)

 


範例:


/*Blog latest update module更新日期欄*/
#ymodupdate{display:none}


 



*部落格相簿


語法說明:


 















/*主題*/內容標題{常用修改樣式}
/*Blog album module部落格相簿*/#ymodalbum
(整個部落格相簿欄)
display:none(不顯示)
filter:alpha(opacity=50)(背景透明度)
#ymodalbum h3
(部落格相簿文字)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:1px double #FFFFFF
filter:alpha(opacity=50)(背景透明度)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
background-color:#FFFFFF(文字背景顏色)
width:140px;height:60px(欄位尺寸)

 


範例:


/*Blog album module部落格相簿*/
#ymodalbum h3{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat;background-position:50% 100%;height:180px}


 



*留言版


語法說明:


 












/*主題*/內容標題{常用修改樣式}
/*Blog guest book module留言板欄位*/#ymodmsgbd h3
(留言板文字)
background-image:url(http://圖檔網址.gif)(背景圖檔)
background-repeat:no-repeat(單一背景不重複)
background-position:0% 0%(單一背景在x與y軸的位置)
border:1px double #FFFFFF
filter:alpha(opacity=50)(背景透明度)
font-family:新細明體(文字字型)
font-size:9px(文字尺寸)
background-color:#FFFFFF(文字背景顏色)
width:140px;height:60px(欄位尺寸)

 


範例:


/*Blog guest book module留言板欄位*/
#ymodmsgbd h3{background-image:url(http://圖檔網址.gif);background-repeat:no-repeat;background-position:50% 100%;height:40px}


 


 


 




引用:http://tw.myblog.yahoo.com/jw!V3nxAk.BFRm.p9KGFpExf.kL8ws_/article?mid=5113

oreokimo 發表在 痞客邦 留言(0) 人氣()