好用的CSS語法 用於網誌喔 可以隱藏一些不需要的東西
像是右邊我的地盤可以把不用的連結刪調等如影音首頁...
點繼續閱讀~~來看教學囉 源自知識
Back第一篇
色碼表http://user.infor.org/~ohb/colorcode.htm
若是想換顏色的,在CSS表裡找出那段語法,並且把他的色碼換掉。
若是隱藏的,你想改顯示的話,在CSS裡找出那段語法刪除就可以了。
圖片網址怎取得? 在你要的圖片上右鍵--內容--網址(即圖片網址)
版面壞掉請使用 還原王
------------------------------------------
語法一律都貼在Css最下方
【文章內容字色】
.innertext {font-family:"字體名稱";color:#-----}
【回應內容改背景圖片】
.blogbody textarea{ background:url('圖片網址') ; }
【連結無底線 】
a{text-decoration:none ; }
【網誌分類"更改顏色】
#boxProfile .side {COLOR: #ffffff }
【月曆上面數字的顏色】
.calendar a {color:#------;} "行事曆"
.calendarhead a {color:#------;} 月&年
.calendar tr th .calendar{color:#------;} 星期幾
.calendar span {color:#------;} 日
.calendar td a {color:#------;} 連結 (有寫網誌的那幾天)
.calendar td a:hover {color:#------;} 滑鼠移過去時的連結
【好友連結寬度】
SELECT {WIDTH: ***px}
【給個回應"換底色】
.blogbody textarea{ background:#----; }
【給個回應內容改字色】
#text{color:#-----;}
【文章標題的字改小】
.title {FONT-SIZE: --px! important;}
語法一律都貼在Css最下方
【最新文章改成圖案】
#boxNewArticle {
BACKGROUND: url(' 背景網址 ') no-repeat 30%
0%; PADDING-TOP: 25px; HEIGHT:
160px;PADDING-LEFT: 5px}
【最新回應改成圖案】
#boxNewComment {BACKGROUND: url(' 背景網址 ') no-repeat 30%
0%;PADDING-TOP: 25px; HEIGHT: 50px;
PADDING-LEFT: 5px}
【文章分類改成圖案】
#boxCategory {BACKGROUND: url(' 背景網址 ') no-repeat 30%
0%; PADDING-TOP: 25px; HEIGHT: 110px;
PADDING-LEFT: 5px}
【移到連結旁邊出現圖案】
a:hover{color:色碼;text-decoration:none;background:url(圖案網址) fixed norepeat left center;padding-left:9px;}
【資料夾那邊的移到連結旁邊出現圖案】
#links a:hover{color:色碼;background:url(圖案網址) fixed no-repeat left center;
padding-left:9px;}
【連結=相簿 首頁 網誌旁邊加上圖案 】
#linkMypage, #linkAlbum, #linkBlog, #linkGbook,
#linkUser, #linkFriend { background: url(圖片網址)
left no-repeat; padding-left:20px; }
【繼續閱讀四個字換圖片 】
articletext .extended A {
DISPLAY: block; FONT-SIZE: 0px!
important; BACKGROUND: url(圖片網址)
no-repeat right bottom; MARGIN-BOTTOM:
0px; MARGIN-LEFT: 195px; WIDTH: 圖寬px;
COLOR: #fff! important; HEIGHT: 圖高px}
【文章已受主人保護,請輸入密碼才能閱讀文章"此段字顏色】
.articletext .innertext form{color:#色瑪;}
【文章分類所有文章列表不會有鎖頭圖案】
.articletext table a img{display:none}
【網誌好友名單隱藏】
select{display:none;}
【隱藏"搜尋這個網誌的文章"】
#boxSearch {display:none;}
【隱藏"給禮物隱藏方法"】 ←真不知道這是幹嘛的...
.boxGiftLink{display:none;}
【隱藏"加為好友"】
.boxAddFriendLink {display: none;}
【讀文章時不出現標題】
h1 .description{display:none}
【點繼續閱讀後文章標題移動位置】
#pageheader h1 span.description {margin-left:---px}
【給個回應的小捲軸顏色設定】
#text {BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 10px; PADDING-LEFT: 10px; SCROLLBAR-FACE-COLOR: #色瑪; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 10px; BACKGROUND: #色瑪; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 10px; SCROLLBAR-HIGHLIGHT-COLOR: #色瑪; SCROLLBAR-SHADOW-COLOR: #色瑪; COLOR: #000; SCROLLBAR-3DLIGHT-COLOR:#色瑪; SCROLLBAR-ARROW-COLOR: #色瑪; PADDING-TOP: 10px; SCROLLBAR-TRACK-COLOR: #色瑪; FONT-FAMILY: Comic Sans MS; SCROLLBAR-DARKSHADOW-COLOR: #色瑪; BORDER-RIGHT-WIDTH: 0px}
【網誌連結文字滑鼠未移上去的顏色】
A {FONT-SIZE: 10px; COLOR: #色碼; FONT-FAMILY: arial; TEXT-DECORATION: none}
【網誌連結文字滑鼠移上去的顏色】
A:hover {cursor:crosshair ; TEXT-DECORATION: none;color:#色碼;}
【發表新文章/樣式管理/網誌管理按鈕的顏色】
INPUT {BORDER-RIGHT: #邊框色碼 0px solid; BORDER-TOP: #邊框色碼 0px solid; FONT-SIZE: 10px; BACKGROUND: #FFFFFF; BORDER-LEFT: #邊框色碼 0px solid; COLOR: #文字色碼; PADDING-TOP: 2px; BORDER-BOTTOM: #邊框色碼 0px solid; FONT-FAMILY: verdana, arial;text-align:left}
【輸入密碼的框框】
.innertext form input{border-battom:2px dotted #色碼 }
紅色文字可替換solid double dotted dashed
grooved、inset、outset、ridged 至於顯示是啥自己玩玩!
【日期前面加圖示】
.date {background-image:url(圖案網址);
background-position: left;background-repeat:no-repeat;}
【日期一些設定,日期字太小圖檔就會被卡到】
.date {MARGIN-TOP: 5px; PADDING-LEFT: 24px; FONT-WEIGHT: bold; FONT-SIZE: 15px; BACKGROUND: url() background-position: left; COLOR: #文字色碼; FONT-FAMILY: georgia; LETTER-SPACING: -0.1em; TEXT-ALIGN: left}
TOP: 往上(下則是BOTTOM)
LEFT: 往左(又則是LIGHT)
bold:粗體(細體是normal)
FONT-SIZE:字體大小
【文章標題顏色+字型】
.articletext .title {MARGIN-top: 0px;PADDING-LEFT: 18px; FONT-WEIGHT: bold; FONT-SIZE: 12px; BACKGROUND: url() no-repeat 5px center; COLOR: #文字色碼; FONT-FAMILY: verdana;}
verdana是最常用的字型也可改娃娃體.童童體等...
但前提觀看者電腦內必須有這些字型
不然看出去都是細明體
【文章內容顏色】
.articletext .innertext {PADDING-RIGHT: 10px; PADDING-LEFT: 24px; FONT-SIZE: 10px;
LINE-HEIGHT: 170%; FONT-FAMILY: verdana;COLOR: #文字色碼;letter-spacing :2px; }
【此分類上一篇,字樣部分顏色】
.articletext .extended {COLOR:#文字色碼;PADDING-RIGHT: 10px; FONT-SIZE: 10px; MARGIN: 0px; FONT-FAMILY: "打字體"; TEXT-ALIGN: right}
【"繼續閱讀"四個字顏色】
.extended a {color: #------}
【"給個回應"四個字換上圖片】
.comments-bottom .comments-head{
background:url('圖案網址') no-repeat left bottom ;}
如果會檔到圖案就加上下句:
.comments-bottom .comments-head{text-align:right;height:30px;color: #底色}
【本篇文章引用網址欄位裡面字的顏色】
.trackback-url {FONT-SIZE: 10px;COLOR: #-----;}
【輸入回應那區塊放置圖片】
.comments-body #text {background:url(圖案網址') no-repeat
right bottom}
【有登入後的的回應者ID前面加圖示】
.postuser {PADDING-RIGHT: 20px; BACKGROUND: url(圖案網址') no-repeat right 10%;
MARGIN-RIGHT: -13px;color:#FF5A78 !important}
【已送出留話的字色】
.total-comments-div .comments-body { COLOR:#色碼 }
【回應人填名字URL和電子信箱字的顏色】
#url{color:#色碼;}
#email{color:#色碼;}
#name_id{color:#色碼;}
【回應人如有填電子信箱會顯示的小圖片】
.postemail {BACKGROUND: url(圖案網址) no-repeat 50% 50%}
【別人回應的小房屋】
.postweb {BACKGROUND: url(圖案網址) no-repeat 50% 50%}
【給個回應欄位寬度】
#textarea {WIDTH: -----px!important}
【給個回應區域線框的顏色設定】
#text {border: #色碼 1px dashed}
紅色文字可替換solid double dotted dashed
grooved、inset、outset、ridged 至於顯示是啥自己玩玩!
【隱藏播放中相簿字樣】
#boxSlideShow .boxSlideShow0 {display:none;}
【相片說明文字拿掉】
#SlidePicTitle {display:none;}
【暫停字樣換色】
#buttonPlayPause{color:#色碼;}
繼續第三篇
推薦上專欄



本篇迴響權限: 開放所有人迴響