要更改時 強烈建議你 先將語法-全選-複製 起來
用word先備份 以防萬一
請從-管理部落格進入-選面板設定-選自訂樣式
會出現css語法
最佳奇摩背景圖尺寸1003X640像素
最佳標題橫框圖尺寸750X103像素-這尺寸可在CSS語法變更
我要留言尺寸-520X52像素-沒時間測試 還不知道最佳尺寸
↑這尺寸也可在CSS語法變更
背景 橫框圖片必須是放置在網路空間的圖片
不行用自己電腦內的圖片
不行用各部落格相簿內的圖片(放在奇魔部落格內的照片可以使用,但會有圖檔太小的困擾)
需上傳圖片請參考
免費上傳圖片網教學
http://tw.myblog.yahoo.com/monkey_014148/article?mid=669
如果你沒有用進階樣式 -自訂 背景圖- 就請在第一排語法中 改背景圖
/*Background*/
body{background:#FFFFFF url(http://tw.yimg.com/i/tw/blog/skin3/bg2.jpg) repeat-x;}
如果你跟我一樣 有用進階樣式 -自訂 背景圖]
請在這更改背景圖
/*Background image for whole page*/
body {background-image: url(http://freebsd.chjhs.tpc.edu.tw/~94214/yo1.gif?TT062zEBw2Fyl15D); background-repeat: repeat}
標題背景圖設定-要先設定這裡 才會有標題語法出現
管理部落格進入-選面板設定-進階樣式-選標題底圖 先隨便先選一張圖
標題的橫框圖 請在這更換
/*Background image for blog title*/
#yblogtitle .mbd {background-image: url(http://freebsd.chjhs.tpc.edu.tw/~94214/yo3.gif?TT062zEBTY6JKjzB); background-repeat: no-repeat}
我要留言 的說話橫框圖 請在最後一排語法 內更換
/*Opacity for blast*/
#yblast .bg {zoom:1; filter:alpha(opacity:100); background: url(http://freebsd.chjhs.tpc.edu.tw/~94214/yo2.gif) no-repeat}
我也測試過 奇摩這不支援swf 動畫檔
轉圖檔教學
http://freebsd.chjhs.tpc.edu.tw/~94214/8-9.htm
可用來做奇摩部落格橫扁背景圖素材
http://tw.myblog.yahoo.com/monkey_014148/article?mid=388
亮麗唯美閃圖動畫背景圖
http://tw.myblog.yahoo.com/monkey_014148/article?mid=156
GIF動畫調整影像尺寸-
開啟Ulead GIF Animator -按編輯-選改變影像大小
JPG調整影像尺寸-
開啟PhotoImpact -按調整-選調整大小
----------------------------
測試心得:
自由欄位-可以接受GIF、 連結語法
-不接受MP3 、SWF動畫檔、影片檔
文章影音部份-一篇文章只接受一則影音
目前測試到可接受這3種網頁影音
MP3部分還沒測試完成 目前我測試的方法都失敗
奇摩-影音蒐集網
http://video.yahoo.com/
YouTube-MV蒐集網-目前維修當機狀態
http://www.youtube.com/results?search=%E4%BC%8D%E4%BD%B0&search_type=search_videos
google-影音蒐集網
http://video.google.com/
基本語法解釋:
background-repeat:no-repeat /*背景不重覆*/
background-repeat:repeat-x /*背景在X軸方向重覆*/
background-repeat:repeat-y /*背景在Y軸方向重覆*/
background-position : right /*背景位置靠右*/
background-position : left /*背景圖靠左*/
background-position : center /*背景圖置中*/
背景本身要夠大張(請用繪圖軟體自行設計),才可使背景完整填滿整個頁面,不然就要用repeat語法去填充整個頁面。
利用繪圖軟體設計背景時建議圖片大小為1024X600(畫素),相簿框的大小為120X120(畫素)。(螢幕解析度為1024X768時適用)
body{
background :色碼; # /*背景底色*/
background-image : url('背景圖片網址'); /*背景圖片網址*/
background-repeat : repeat; /*背景圖片重複排列*/
background-attachment: fixed; /*背景圖片固定*/
}
800*600的解析度螢幕,自製背景大小為780*440即可
在CSS內容,找到下面這兩個項目語法,改一下網址跟固定值即可固定背景。/*Background*/ (基本設定的背景圖改成自製的背景圖)
body{background:#000000 url(http://home.pchome.com.tw/good/zz14723/cloud/12-1.jpg ) no-repeat;}
/*Background image for whole page*/ (自選背景圖片)
body {background-image: url(http://home.pchome.com.tw/good/zz14723/cloud/12-1.jpg); background-repeat:repeat;background-attachment: fixed;} (背景固定值為fixed
CSS樣式表
語法一:使用 標籤
語法二:直接寫在標籤內
語法三:外掛方式
樣式種類 說明
background-color 背景顏色
background-image 背景圖片
border-top 設定上邊框線
border-bottom 設定下邊框線
border-left 設定左邊框線
border-right 設定右邊框線
border-color 設定邊框顏色
color 設定文字顏色
height 設定高度
width 設定寬度
text-align 對齊方式
text-decoration 文字修飾方式
font-size 字型大小
font-weight 字型粗細
background-attachment 背景是否固定
background-position 背景圖片的位置
background-repeat 重複貼圖方式
border-top-width 設定上邊框線厚度
border-bottom-width 設定下邊框線厚度
border-left-width 設定左邊框線厚度
border-right-width 設定右邊框線厚度
border-width 設定邊框厚度
border-style 設定邊框樣式
border-collapse 邊框線重疊
float 設定文繞圖
text-indent 縮排
text-transform 大小寫轉換
font-family 字型名稱
font-style 字型樣式
font-variant 大小寫變換
letter-spacing 文字間距
line-height 設定行高
list-style-type 項目符號樣式
margin 設定邊界
margin-top 設定上邊界
margin-bottom 設定下邊界
margin-left 設定左邊界
margin-right 設定右邊界
padding 設定邊距
table-layout 表格配置方式
CSS串聯樣式表教學『基礎篇』
CSS是「Cascading Style Sheets」縮寫,一般稱為【串聯樣式表】
CSS有甚麼好處呢?為甚麼要學呢?以下說明幾點你就會發現使用CSS的好處:
■它能更精確的控制網頁版面的文字、背景、字型等...
■它能讓我們只修正一個CSS文件,便可同時更新眾多的網頁版面外觀及格式。
■它可以使用html的文件內碼更精簡,縮小檔案下載的速度。
■適用於各種作業平台。
CSS串聯樣式表教學『文字屬性一覽』
color : #525050 /*文字色彩*/
font-family : 新細明體 /*文字字型*/
font-size : 9pt /*文字大小*/
font-style:itelic /*文字斜體*/
font-variant:small-caps/*小字體*/
letter-spacing : 1pt/*字間距離*/
line-height : 200% /*設定行高*/
font-weight:bold /*文字粗體*/
vertical-align:sub /*下標字*/
vertical-align:super/*上標字*/
text-decoration:line-through/*加刪除線*/
text-decoration:overline /*加頂線*/
text-decoration:underline /*加底線*/
text-decoration:none /*刪除連結底線*/
text-transform : capitalize /*首字大寫*/
text-transform : uppercase /*英文大寫*/
text-transform : lowercase /*英文小寫*/
text-align:right /*文字靠右對齊*/
text-align:left /*文字靠左對齊*/
text-align:center /*文字置中對齊*/
連結屬性:『屬性分類』
A /*所有超連結*/
A:link /*超連結文字格式*/ (是代表普通狀態的連結)
A:visited /*瀏覽過的連結文字格式*/ (是代表造訪過的連結)
A:active /*按下連結的格式*/ (是代表按下去連結)
A:hover /*滑鼠移至連結*/ (是代表滑鼠移到連結)
color 是代表連結顏色
font-size 是代表連結文字大小,適用 point(pt) 或是 pixels(px)
text-decoration 是代表文字樣式,none 代表沒有底線
網友分享部落格背景語法,想要換換部落格背景口味的有救了囉!
把下列背景語法貼到部落格或是播客的進階編輯CCS中即可
1.固定背景語法(適用小背景)
BODY {background: white url(圖片網址);background-attachment: fixed}
2.移動背景語法(適用小背景)
body{background:#4e87ff url(圖片網址) repeat;}
3.固定背景語法(適用大背景)
body {background-image: url(圖片網址);
background-repeat:no-repeat ;
background-position : 50% 10%;
background-attachment: fixed;}
4.雙重背景語法(適用大背景)
/*大標題圖+純色重覆底背景*/
body {background-color:#色碼;background-image: url(圖片網址): top center; }
#yblogtitle .mbd,#yblogtitle .mft{background: url(空的或圖片網址) no-repeat;}
#yblogtitle .tft {margin:數字px 0px 0px 0px;} /*數字決定標題圖顯示的高度*/
背景圖+人物+swf製作動畫語法設計:
1.先找到一張風景圖或花圖..等皆可,尺寸適中
2.人物圖...等圖(想做合併的圖)尺寸不拘
因可用語法height=圖高 width=圖寬做尺寸的縮放
style="FILTER: alpha(style=3)"
人物圖做漸層霧化處理,這樣才可以和風景圖有融合的感覺
記得在img語法中在加上定位align=right定位語法
因這樣才可以在加上flash透明動畫時,不會佔位置
若設在align=left是會佔位置的,畫面會變大很多
3.找喜歡的flash動畫,豐富語法畫面
http://blog.xuite.net/notebooklover/money/37405896