★ Blog 語法總匯解析o3 ★

2009093001:36

 

雙のlogo

這是雙在各大部落格收集起來的.有重新整理過了

這樣要找語法也比較方便.屬於綜合版的~

以下是雙整理後的內容.喜歡請帶走吧︿︿!

 

我要回應我要引用消失語法
/*make coomment bar*/
.btncomment{display:none;}
.btntrackback{display:none;}

/*滑鼠指標移到超連結顯示立體彩邊框*/
a:hover {border-left:3px ridge #00ffff; border-right:3px ridge #ffff00; border-top:3px ridge #00ff80; border-bottom:3px ridge #ff00ff; }
語法解說 : BORDER邊框的設定
left=左邊框
right=右邊框
top=上邊框
bottom=下邊框
ridge=脊狀(立體感設定語法)
3px=像素值(建議使用在1~5之間)
#ff00ff=顏色色碼(可搭配個人使用的背景配色)
色碼表應用注意:有些色碼無支援應用在奇摩部落格當邊框顏色,無支援的貼上只會顯示灰色

欄位自動加框:
http://tw.myblog.yahoo.com/et32-joy2/article?mid=251

第一語法

.ycntmod .mbd ul.list li {BACKGROUND: url(http://www.ek21.net/0023.gif) 0% 50%;}

第二語法

.ycntmod .mbd ul.list li {BACKGROUND: url(http://www.ek21.net/002.gif) 0% 50%; COLOR: white; BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;}

第三語法

.ycntmod .mbd ul.list li {COLOR: rgb(255,51,153); BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; TEXT-DECORATION: none; BORDER-BOTTOM-STYLE: double;}

第四語法

.ycntmod .mbd ul.list li {COLOR: rgb(204,255,102); BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BACKGROUND-COLOR: rgb(0,0,51); BORDER-BOTTOM-STYLE: double;}

(設定框線距離)

BORDER-TOP-STYLE 頂部
BORDER-BOTTOM-STYLE 底部
BORDER-LEFT-STYLE 左
BORDER-RIGHT-STYLE 右
double(更改指令邊框樣式也會不同)

邊框樣式指令:none(無邊框)
       dotted(點線)
       dashed(虛線)
       solid(實線)
       double(雙線)
       groove(立體凹線)
       ridge(立體凸線)
       inset(立體嵌入線)
       outset(立體隆起線)

white 顏色
1px 框線寬度

第五語法

/*自動加框*/

.ycntmod .mbd ul.list li {BACKGROUND: url(底圖網址) 0% 50%; COLOR: white; BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;}

↓ 下面是晨曦婆婆修改版

/*自動加框*/
.ycntmod .mbd ul.list li  {BACKGROUND: url(
http://dye.mychat.to/bg_img/sa/dye_sa_0139.gif) 0% 50%; COLOR: white; BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;}

/*Nav module list*所有文章前小圖*/
.ycntmod .mbd ul.list li {background:url(
http://wisdom61.googlepages.com/100.gif) left .1em no-repeat;padding-left:20px;margin-bottom:3px;_margin-bottom:3px;_line-height:25px;}
.ycntmod .mbd ul.list li.more {margin:-3px 0 0 -3px;text-align:right;background:url(
http://wisdom61.googlepages.com/100.gif) 40px center no-repeat;}

↓ 下面是晨曦婆婆統合版兩個語法合起來

/*Nav module list*所有文章前小圖*/
.ycntmod .mbd ul.list li {background:url(
http://wisdom61.googlepages.com/100.gif) left .1em no-repeat;padding-left:20px;margin-bottom:3px;_margin-bottom:3px;_line-height:25px;COLOR: white; BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;}
.ycntmod .mbd ul.list li.more {margin:-3px 0 0 -3px;text-align:right;background:url(
http://wisdom61.googlepages.com/100.gif) 40px center no-repeat;COLOR: white; BORDER-TOP-STYLE: double; BORDER-RIGHT-STYLE: double; BORDER-LEFT-STYLE: double; BORDER-BOTTOM-STYLE: double;}

語法中,COLOR: white; 是指框線白色

/*Blog guest book module隱藏留言板欄位*/
#ymodmsgbd h3{display:none}

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

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

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

/*隱藏左右欄位標題*/
.yc3sec .mhd,.yc3sub .mhd{display:none}
.yc3sec .mbd,.yc3sub .mbd{zoom:1;filter:alpha(opacity:0)}

/*隱藏文章欄位標題*/
.yc3pribd .mhd{display:none}
.yc3pribd .mbd{zoom:1;filter:alpha(opacity:0)}

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

/*隱藏回應按鈕*/
div.btncomment a {display:none;}

/*隱藏留言板*/
#ymsgboard {display:none;}

/*隱藏回應欄位*/
#rtemodule {display:none;}

留言版PO圖吸引訪客
<a title="名字例如﹕留言版" href="連結網址" target="_blank"><img border="0" src="連結圖案" width="120" height="44"></a>

/*招呼語圖框 我要留言 字樣刪除*/
#yblast .text a{display:none;}

更改三欄欄寬語法

三欄式~欄寬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*/

調整部落格字體大小+改變顏色

/*Background color for blog title置頂欄框 調整顏色+字體大小*/
#yblogtitle .mbd, #blogtitle .mft { font-size:110%; background-color:#FFFFFF}

/*Main content header編輯管理標題  留言板標題  調整顏色+字體大小*/
.yc3pribd .mhd{ font-size:120%; background:#000000; color:#FFFFFF;}

/*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{ font-size:110%; background:#000000; color:#000000;}

/*Background color for main content body自我介紹欄  留言板 文章內容  調整顏色+字體大小*/
.yc3pribd .mbd, .yc3pribd .mft, #yreplymsg table, #ysbscrblist table, #ybloginfo table, #yusrinfo table, #yusrintro p { font-size:110%; background: #FFFFFF}

/*Nav module body左右欄框內容 調整顏色+字體大小*/
.yc3sec .mbd, .yc3subbd .mbd, .yc3sec .mft, .yc3subbd .mft{ font-size:105%; background:#000000; color:#FFFFFF;}

連結出現虛線框框

/*Links色彩虛線框*/
a,a:link,a:visited{color:
色碼;text-decoration:none}a:hover{color:色碼;background-image:url();background-repeat:repeat;border:1px dotted色碼;position:relative;top:1px;left:1px}

自訂留言板內文樣式

/*文章欄我要留言按紐背景小圖-我要留言字體-顏色-字型-粗體字*/
#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 .text {color:#ff00ff;font-family:新細明體;font-size:24px;}

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

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

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

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

SIZE: 9px是框線粗細,自己調整,9PX為細線。

/*部落格檔案、個人資料、自我介紹*/

/*部落格檔案-背景圖-預設背景顏色-字體顏色(字型預設值,不需設定)*/
#ybloginfo table {background: url(圖片網址) #1B006B repeat ; color:#FFFF00;}
#ybloginfo table th {background: url(圖片網址) #1B006B repeat ;color:#FF0000;}

/*個人資料-背景圖-預設背景顏色-字體顏色(字型預設值,不需設定)*/
#yusrinfo table th {background: url(圖片網址) #1B006B repeat ;color:#FF0000;}
#yusrinfo table {background: url(圖片網址) #1B006B repeat ;color:#FFFF00;}

/*自我介紹-背景圖-預設背景顏色-字體顏色(字型預設值,不需設定)*/
#yusrintro p {background: url(圖片網址) #1B006B repeat ;color:#FFFF00;}

/*回應列表*/

/*回應列表-文章與相片回應轉換按鈕底色與待連結字體顏色(字型預設值,不需設定)*/
#ycmntlist .mbd li a {background:#0000ff;color:#ff00ff;}

/*回應列表-文章與相片回應轉換按鈕底色與已開啟字體顏色(字型預設值,不需設定)*/
#ycmntlist .mbd li strong {background:#0000ff;color:#ffff00;}

/*回應列表-背景圖-預設背景顏色-回應者字體顏色(字型預設值,不需設定)*/
#ycmntlist .listbd {background: url(圖片網址) #1B006B repeat ; color:#FFFF00;}

/*回應列表-回應標題-背景顏色-字體顏色(字型預設值,不需設定)*/
#ycmntlist table th {background:#1B006B; color:#FFFF00;}

/*回應列表-板主回覆-背景顏色-字體顏色(字型預設值,不需設定)*/
#ycmntlist .reply {background:#1B006B; color:#00ff80;}

/*回應列表-其它連結字體顏色(字型預設值,不需設定)*/
#ycmntlist .listbd a {color:#ff00ff;}

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