感謝小小羊兒的分享



左右欄位標題小圖
　範例：
 ↓下面的CSS語法是目前部落格所使用的
/*Nav module list*/
.ycntmod .mbd ul.list li {background:url(文章標題前面圖檔位址) left .1em(圖片下移數值，數字越大下移越多） no-repeat;padding-left:17px(文章標題前面圖檔和右邊文字相差距離，數字越大，兩者之間距離越遠);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(所有文章和更多回應圖檔位址) 48px center no-repeat;}
 將灰色的部份，貼上連結圖檔的網址，前後括號＂（）＂也是語法之ㄧ喔，別刪除喔！
語法範例:




/*Nav module list*/
.ycntmod .mbd ul.list li {background:url(http://XXXXX.gif) left .1em no-repeat;padding-left:17px;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(http://XXXXX.gif) 48px center no-repeat;}

圖檔不宜選擇過長寬過大的，容易影響整體效果，
當然除了上面特別標出來的數字，還有其他數字值可以調整，
可以依照選用的圖檔自行去修改！

 更新日期標題小圖
　範例：
↓下面的CSS語法是目前部落格所使用的
/*Module latest upup*/
#ymodupdate .mbd .date{background:url(圖檔位址) left center no-repeat;padding-left:11px(圖檔和右邊文字相差距離，數字越大，兩者之間距離越遠);font-size:104%;font-family:verdana;}
 將灰色的部份，貼上連結圖檔的網址，前後括號＂（）＂也是語法之ㄧ喔，別刪除喔！
語法範例:




/*Module latest upup*/
#ymodupdate .mbd .date{background:url(http://XXXXX.gif) left center no-repeat;padding-left:11px(圖檔和右邊文字相差距離，數字越大，兩者之間距離越遠);font-size:104%;font-family:verdana;}
圖檔不宜選擇過長寬過大的，容易影響整體效果，
當然除了上面特別標出來的數字，還有其他數字值可以調整，
可以依照選用的圖檔自行去修改！


標題前圖示（任何適當大小圖檔都可以）
　範例：
↓下面的CSS的語法，是部落格目前使用的
/*Article content module*/
.yblogcnt .blgtitlebar {margin-bottom:10px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:120%;font-weight:bold;background:url(圖示網址) no-repeat;padding-left:32px;}
將灰色的部份，貼上連結圖檔的網址，前後括號＂（）＂也是語法之ㄧ喔，別刪除喔！
語法範例：




/*Article content module*/
.yblogcnt .blgtitlebar {margin-bottom:10px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:120%;font-weight:bold;background:url(http://xxxxx.gif) no-repeat;padding-left:32px;}
修改紅色部分 就可以了 數字越大 可以顯示的圖也越大
不過 後面的字也會跟著放大(會變的醜醜的)
建議是大小差不多像這個部落格的@@
補充說明: 綠色字體那邊數字大小 代表圖示和字體的間距 數字越大間距越大
>說明     (圖)__間距__ (標題)
注意：圖示一定要用網路空間的喔！
　　　自己電腦中或是部落格的都不行喔！



注意：上面有些語法，在自訂模式中ＣＳＳ與法已經有存在了～
　　　使用的時候，請先察看該與法是否存在～
　　　若是存在，代表該效果的語法只是修改部分，
　　　此時，修改那些部分即可！
　　　（重覆貼取語法，可能會造成效果無法顯示，或是其他無法預期的事情）
　　　而該語法不存在（即原本ＣＳＳ語法中沒有），
　　　請將整個語法直接貼上使用！

補充：修改ＣＳＳ的時候，請先將ＣＳＳ備份！

○注意○
請體恤原創教學者的心血，別忘記＂引用是一種尊重＂


 ○關於本篇教學相關○
語法是共享的，只是在使用之前能做到一點
＂引用是一種尊重＂
＂註明是一種尊重＂
arrow
arrow
    全站熱搜

    鳳梨頭 發表在 痞客邦 留言(3) 人氣()

    E-mail轉寄