日誌2007-09-06 22:11

小屋系統預設圖片更換教學 - PART 4

感謝大家不棄嫌m(_ _)m



那就容我這個門外漢繼續班門弄斧吧~~~



今天來教大家換這個。

紅色圈起來的部分，我想應該也有人動過腦筋想換掉它....
我參考了u4大的這一篇，
想出了比較簡單的方法讓大家看懂。
不過千萬記得一定要備分哦~~~


在這裡先謝謝u4大的教學:P


教學開始。


1.看一下這張圖，
對了....這段文字在自訂CSS裡面是找不到的="=要自己輸入哦

我解釋一下標出123456的那幾段意思。

(1)是指你想放那張圖片的高度。
至於寬度呢，由於這個地方的欄位寬度大概在173px左右，所以我建議圖片的寬度請約設在175左右。
(2)這是你想放的圖片連結。
(3)是指你的圖片想放靠左靠右還是靠中間...當然沒有靠北邊啦，
靠左：left<我圖片裡的t好像被我塗到了="=>　靠右：right　置中：center
(4)就是剛剛一開始最上面那張圖用紅線圈起來的、那堆標題的顏色。
(5)這指你的標題要離左邊的界線多遠。當然啦，你也可以把left改成right，請自行嘗試，本人不負責後果....
(6)這是代表你的標題離上一行要多高。

2.文字敘述是這樣，大家可以考慮複製回家用看看。
哦對了，可能有人問要放在哪哩，
我是放在CSS語法的最下面啦~~這樣比較好找。

/*------右下的標題格式-------*/
.post_title {
height:數字px;/*圖片高度*/
background-image:url(http://圖片網址);
background-position:left;
COLOR: #;
PADDING-left:70; /*←文字與左方的距離，請自行調整。*/
PADDING-top :25; /*←文字與上方的距離，請自行調整。*/
}

3.請按『確定送出』。
4.可以參考一下我已經換成功的右邊欄位看看哦。

20

25

LINE 分享

相關創作

關於偉大的我轉職變成龍術士這檔事3

30系顯卡驅動推薦，N卡驅動推薦 517.48

2024巴哈市集~魔女的領域

留言

• 2007-09-06 22:16阿築：
  搶頭香 >///<

  2007-09-06 22:17淵：XD感謝你這麼支持我

• 2007-09-06 22:30藏鏡咪咪：
  來幫你加油打氣~^^
  我剛剛寫了一篇閃字教學~有興趣的話~歡迎來看看喔^^
• 2007-09-06 23:03異 / 啻異：
  很仔細唷!
  我通常都只提供CLASS的名稱跟基本組件就當作沒事一樣(←很壞)
  比較沒基礎的巴友看到大概都會傷腦筋吧
  寫的很棒>3<~/

  2007-09-06 23:04淵：您提供的語法剛好解決我研究很久的困擾...
  因為我是門外漢啊XD~

• 2007-09-06 23:27御風：
  沒想到還有4 淵姐的教學是我很容易的懂得~

  2007-09-06 23:30淵：其實還有part5...只是我正在煩惱按鈕要怎麼寫教學= =
  因為有夠複雜的Orz

• 2007-09-06 23:45遺忘：
  每篇一推，就屬Houup的教學最容易懂~"~
• 2007-09-07 01:08小屋因故停止更新：
  XD (還有part5呀XD)
  繼續收集~
  一樣收藏+GP
  ~~~~~
• 2007-09-07 10:33高木　碁伸駿：
  只有文字的教學都看不懂啦　還是一圖解千文最棒>///<
• 2007-09-07 15:02柳丁：
  有再幫人製作專屬的 CSS 嗎 XD (奔

  2007-09-07 19:11淵：請不要拿柳丁來付款就考慮....

• 2007-09-07 18:04昨日夢醒今日醉：
  這篇我還是要推回去~推
• 2007-09-07 22:01赫斯蒂亞：
  嗯~
  請問一個問題,要是不想用底圖,想讓他直接透明,怎麼用呢??
  教學辛苦囉^^

  2007-09-07 22:20淵：應該還是要用底圖....
  就用繪圖軟體弄出一個1*1大小的透明圖放上去就可以了。
  

• 2007-09-07 23:57路人喵：
  謝謝妳　又讓我把我的小屋更新了！
  
  謝謝大大的教學^^
• 2007-09-08 20:48Glass：
  努力地推啊~~~~~~！
  
  打包打包　=　=+
• 2007-09-08 23:44~Ceylon錫蘭~：
  收藏去了!感恩啊~>口<
• 2007-09-14 13:46魔獸過夜：
  3Q
• 2007-09-22 18:29逆襲：
  警察來了
  
  老闆叫我要在10秒內全打包走
• 2007-10-25 20:02Miyami：
  好棒的解說，簡單易懂阿(大推
• 2007-11-04 10:20奸仔蘭˙華麗閃耀：
  淵大
  我寫了這段放在最下面~
  /*------右下的標題格式-------*/
  .post_title {
  height:50px;/*圖片高度*/
  background-image:url(http://farm3.static.flickr.com/2264/1840454720_325c79ea97_o.jpg);
  background-position:left;
  COLOR:7D055A#;
  PADDING-left:70; /*←文字與左方的距離，請自行調整。*/
  PADDING-top :25; /*←文字與上方的距離，請自行調整。*/
  }
  可是沒有圖耶ˊˋ

  2007-11-05 00:09淵：我試過了，是有圖的哦，你這段沒寫錯
  應該是其他地方沒改到吧...我懶得去翻(逃)

• 2007-11-04 10:20奸仔蘭˙華麗閃耀：
  淵大
  我寫了這段放在最下面~
  /*------右下的標題格式-------*/
  .post_title {
  height:50px;/*圖片高度*/
  background-image:url(http://farm3.static.flickr.com/2264/1840454720_325c79ea97_o.jpg);
  background-position:left;
  COLOR:7D055A#;
  PADDING-left:70; /*←文字與左方的距離，請自行調整。*/
  PADDING-top :25; /*←文字與上方的距離，請自行調整。*/
  }
  可是沒有圖耶ˊˋ
• 2007-11-05 00:20奸仔蘭˙華麗閃耀：
  阿@@a??
  我修改這邊
  還需要修改別的地方嗎@@
  我是直接複製你那一段放在最下面
  可是沒有顯示啊ˊˋ
• 2007-11-05 00:39奸仔蘭˙華麗閃耀：
  找到問題點了
  因為我放在div.footer 下面
  所以他就直接改了這一塊
  因此我放在上面就行了=口="
• 2007-11-05 00:39奸仔蘭˙華麗閃耀：
  找到問題點了
  因為我放在div.footer 下面
  所以他就直接改了這一塊
  因此我放在上面就行了=口="
• 2007-11-20 14:13小八：
  好厲害!!!!
• 2007-12-26 15:36皇羅：
  感謝教學~~~
• 2008-02-02 11:52小角落..：
  謝謝你的教學~~總是圖文並茂~~
  可是請問一下~我圖片可以出來~
  可是會造成一整條~~白白的..
  有辦法項您那樣~字後面是透明的嗎?
  因為我的圖示GIF檔~項您那樣小小一張而已..
  一直弄不好><
  我知道有個語法是透明的filter:alpha(opacity=70);
  不過如果用0的話~會連字 整個都消失吧~
  麻煩解答一下><~感謝你..
• 2008-08-21 19:25澪：
  精華教學

• 送出