日誌2007-10-07 11:06

【小屋】CSS自訂版面：進階─頁碼按鈕樣式修改　篇

＜本文發表於2007/10/07 最後修改於2007/10/07 如語娃娃＞
前言：
　　‧本篇教學語法是為外加語法，請自行將語法置於自己方便修改的地方。
　　‧修改方向，請見後述補充圖解。
　　‧如要轉載補充請註明出處。
　　
修改方向：

語法心得：
　　‧如同之前教學所提，每一群組皆可試加不同的語法改變它的呈現，如何的變化就看您的應用。
　　‧這邊所提出的語法只是很簡單的修改效過，更豐富的變化，屋主們可以自行嘗試。

語法列表：
/*-----各區下方頁數按鈕之設定-----*/
/*目前所在頁數的文字區設定*/
.tsmal{
color :#fdeff2;/*文字顏色設定*/
}

/*無連結時的頁數按鈕設定*/
.p_nolink{
background :#fdeff2;/*背景設定*/
color:#CCC;/*文字色*/
border:1px #f09199 solid;/*邊框設定*/
}

/*所在頁數按鈕設定*/
.p_nextprev{
background :#fdeff2;/*背景設定*/
color:#CCC;/*文字色*/
border:1px #f09199 solid;/*邊框設定*/
}

/*非所在頁數按鈕設定*/
.pag{
background :#f09199;/*背景設定*/
color:#fdeff2;/*文字色*/
border:1px #fdeff2 solid;/*邊框設定*/
}

/*滑鼠拜訪頁數按鈕設定*/
.pag:hover{
background :#fdeff2;/*背景設定*/
color:#f09199;/*文字色*/
border:1px #f09199 solid;/*邊框設定*/
}

16

28

LINE 分享

相關創作

[達人專欄] 《墮落人妻~背著丈夫的NTR H》瞞著丈夫的打工還債，這是畫廊模擬器吧！

5/6日記 - 陪室友去逛了歐洲節市集

5/2日記 - 遲發了一點

留言

• 2007-10-07 11:07米兒軒絲：
  謝謝如語分享！
  
  如語也有中獎呢 Q"Q
  
  巴代宅的活動～

  2007-10-07 11:40莉薇婭莞夢：妳是頭獎啊XD！
  
  給我名牌吧XD~~~

• 2007-10-07 11:18藏鏡咪咪：
  好久不見哩!颱風天出門要小心喔!
  如語辛苦啦!妳好棒~
  

  2007-10-07 18:00莉薇婭莞夢：好久不見~跑哪去玩啦XD?
  
  謝謝你>///<
  也恭喜妳得獎囉˙ˇ˙

• 2007-10-07 11:32喵頭人93：
  老闆!打包!!帶走!!!
  
  感恩您黑~~
  
  加油加油再繼續~~

  2007-10-07 17:59莉薇婭莞夢：好，歡迎打包XD
  

• 2007-10-07 11:40闇光：
  受用無窮～
  底色也可以用none改成透明的喔。^^

  2007-10-07 17:59莉薇婭莞夢：對啊，還可以以圖片當按鈕呢@ˇ@
  變化很多呀XD

• 2007-10-07 12:44放空ing：
  如語好棒！！
  來推一個～～～

  2007-10-07 17:58莉薇婭莞夢：點點又換造型啦ˊˇˋ~
  謝謝˙ˇ˙

• 2007-10-07 12:59阿皓：
  我正想改的說
  感謝囉~

  2007-10-07 17:57莉薇婭莞夢：我想動它的腦筋超久了XD

• 2007-10-07 12:59阿皓：
  棒棒!

  2007-10-07 17:57莉薇婭莞夢：謝謝˙ˇ˙

• 2007-10-07 14:3838°C的雪娘：
  如語大懂得好多啊~
  很有意思呢~~
  雪娘要試試看~
  
  
  

  2007-10-07 17:56莉薇婭莞夢：好像沒東西可以改了ˊˇˋ
  接下來是變化XD

• 2007-10-07 16:34Beatrice：
  收走囉，感謝

  2007-10-07 17:56莉薇婭莞夢：歡迎(>ˇ<)///

• 2007-10-07 17:28天才小釣獸：
  語法要貼在哪呀？
  
  看了半天一頭霧水-.-
  

  2007-10-07 17:50莉薇婭莞夢：自定語法的語法列表中最頂或是最底，以您方便修改為準˙ˇ˙

• 2007-10-07 21:57倫：
  哇～連這也能改呀
  真是越來越登峰造極了呢^^

  2007-10-08 19:06莉薇婭莞夢：好像也沒什麼東西能改了ＸＤ：
  
  原本把腦筋動到精華區的顯示圖上
  不過內容的分類看起來就差掉了（汗）

• 2007-10-07 22:41布里薩哆‧凱西：
  謝謝娃娃大大分享的心得，也謝謝您幫我解決問題

  2007-10-08 19:07莉薇婭莞夢：不客氣˙ˇ˙～
  很高興能幫上你的忙。
  雖然別人看不到，我現在也把我的選單改掉了ＸＤ

• 2007-10-08 04:48木壴寸：
  好棒...謝謝呢!

  2007-10-08 19:08莉薇婭莞夢：謝謝˙ˇ˙／／
  不客氣唷～

• 2007-10-08 14:33Secret：
  借新文問個問題一下XD
  請問一下
  在點了"看更多"按鈕後出現的畫面右邊的"最新文章"最新留言"
  那邊字的顏色跟滑鼠移入顏色要怎麼改呢?
  因為我發現那邊的設定跟小屋首頁顯示的不一樣
  謝謝^^

  2007-10-08 19:21莉薇婭莞夢：修改文字顏色即可˙ˇ˙
  
  /*右下的表單標籤list格式*/
  /*標籤設定*//*影響：最新文連結列表*/
  .post_list{
  background:none;
  margin: 0px;
  padding: 0px;
  text-decoration:none;}
  /*連結列表基本設定*/
  .post_list a{
  color:;/*文字顏色*/
  border-bottom: #ccc 1px solid;
  width: 100%;
  background: url(http://) no-repeat left center;
  padding-left: 20px;
  display: block;}
  /*滑鼠移入連結列表*/
  .post_list a:hover{background: url(http://) no-repeat left center;
  color:#eebbcb;/*文字顏色*/
  text-decoration:none;}

• 2007-10-08 15:59綾奈：
  謝謝大大分享^^

  2007-10-08 19:36莉薇婭莞夢：不客氣˙ˇ˙

• 2007-10-08 15:59綾奈：
  謝謝分享

  2007-10-08 19:37莉薇婭莞夢：謝謝~ˇ~

• 2007-10-08 16:40天才小釣獸：
  自訂語法列？
  
  那個在哪啊？
  
  如果要自己打要打在哪？
  
  打什麼？
  
  滿頭???(￣▽￣）ｙ
  
• 2007-10-08 17:21天才小釣獸：
  已找到自訂語法列(￣▽￣"")
  
  可是網址要如何找出？
  
  搞半天也是搞不懂耶…
  
  又是滿頭???
  
  (=口="")

  2007-10-08 19:38莉薇婭莞夢：網址?
  您是指哪方面的網址@@?

• 2007-10-08 22:49Secret：
  不好意思
  我剛試
  發現只有滑鼠移入效果有成功耶囧
  試了好久試不出來Orz
  而且那個項目符號的小綠點不見了
  文字位置也沒辦法恢復成原本的位置囧
  試了很久找不出解決辦法Q__Q
  可以幫我看一下哪裡出問題嗎?
  謝謝^^
  
  .post_list{
  color:#ffffff;
  background:none;
  margin: 0px;
  padding: 0px;
  text-decoration:none;}
  /*連結列表基本設定*/
  .post_list a{
  color:#ffffff;/*文字顏色*/
  width: 100%;
  background: no-repeat left center;
  padding-left: 20px;
  display: block;}
  /*滑鼠移入連結列表*/
  .post_list a:hover{
  background: no-repeat left center;
  color:#a28fb5;/*文字顏色*/
  text-decoration:none;}
  

  2007-10-10 09:32莉薇婭莞夢：改成你要的顏色
  
  .home_c1 a:link, .home_c1 a:visited{color:#FFF;}
  .home_c1 a:hover{color:#FFF;}

• 2007-10-10 07:08阿葉神：
  搶走（誤
  
  最近在更新精華區Ａ＿Ａ
  這篇就偷偷搶走了ＸＤ
  （每篇都要搶走（？））

  2007-10-10 09:59莉薇婭莞夢：歡迎打包＠ˇ＠

• 2007-10-10 14:17Secret：
  不好意思
  我加了那兩行之後整個小屋就壞掉了耶Orz
  原本的我有刪掉了

  2007-10-14 08:59莉薇婭莞夢：壞掉?
  怎麼說@@?

• 2007-10-10 19:50Secret：
  不好意思
  已解決了>口<
  感謝~~~~^^

  2007-10-14 09:58莉薇婭莞夢：不客氣@ˇ@
  還真麻煩您回頭提醒(羞)

• 2007-10-15 23:05~Ceylon錫蘭~：
  大推感謝啊!^^

  2007-10-21 18:02莉薇婭莞夢：呃，現在才注意到回應文(汗)
  
  謝謝推文唷XD~
  話說大大的勇造很多都很好看呢(>///<)

• 2007-10-24 00:50Secret：
  不好意思
  我想請問一下為什麼我改pag裡面字的顏色都不會變>口<
  
  /*非所在頁數按鈕設定*/
  .pag{
  background :#4d4d4d;/*背景設定*/
  color:#ffffff;/*文字色*/
  border:1px #4d4d4d solid;/*邊框設定*/
  }
  
  語法上看不出來哪裡有錯> <
  又要麻煩妳了 謝謝> <

  2007-10-28 21:01莉薇婭莞夢：您好，
  　　抱歉這個時候才回應您＠＠＂
  
  　　其實頁數的文字顏色，有被網頁連結文字顏色壓過，所以就算語法設定正確，還是低於第二套用的語法設定。
  　　除非您整體的連結文字顏色修改和頁碼所希望的文字顏色相同，否則是無法額外自定語法的喔。

• 2007-11-05 21:36幽夜雪：
  打包....帶走...(酸!!)
• 2007-11-06 15:45昨日夢醒今日醉：
  大人這篇我要收藏><~推
• 2007-11-10 03:41被分屍的路人：
  我要給GP！>///<
• 2008-01-12 00:29玩熊：
  感謝大大分享教學

• 送出