這種套入整個flash當底圖的方式，其實很簡單，一般都是套用公板的語法，你只需要注意以下要點逐一作調整和變更，就可以得到很美的畫面~
1.為了美觀，我有加套外框，如以下這段語法，你需要做的是看圖的風格依序調整，請試著調整" " 裡的數值比較看看~
<table bordercolor="#330066" cellspacing="10" cellpadding="1" bgcolor="#ffffff" border="4"><tbody><tr><td>
<1.> bordercolor 外框的顏色
<2.> cellspacing 框的間隔設定 也就是框之間的距離
<3.> cellpadding 框與內文的留空設定
<4.> bgcolor 框內背景的底色
<5.> border 外框線粗細的設定
2.變化底圖。我們看到的大多是採自韓網的素材，韓國人做了很多，也很美，城邦裡也有很多人幫忙搜尋到許多提供給大家，請看底下語法中這一段的數值，
<embed src="http://mapa.cafe24.com/card/mapa_card_awoollim_313/mapa_card_awoollim_313.swf" width="470" height="650" type="application/x-shockwave-flash" wmode="transparent" />
你可已依據數字上下變動去尋找自己喜歡想用的圖，例如
http://mapa.cafe24.com/card/mapa_card_awoollim_314/mapa_card_awoollim_314.swf
http://mapa.cafe24.com/card/mapa_card_awoollim_315/mapa_card_awoollim_315.swf
然後視圖的大小調整成自己要的長寬，這部分我大部是抓約略值~，找到自己喜歡的可以筆記下來，下次好用
3.調整座標。因為每張圖的空白處不一定，所以你要使用下列語法調整放字的位置，至於數字部份，實在就要靠經驗，等一下我還會貼一個有關【區塊標籤搭配的語法(Div、Span)】給你參考，
<div style="LEFT: -330px; POSITION: relative; TOP: -600px"><div id="layer1" style="Z-INDEX: -1; LEFT: 546px; WIDTH: 267px; POSITION: absolute; TOP: 10px; HEIGHT: 600px">
4. 依據圖的風格調整自的顏色，例如以下的字的大小、顏色、和行距
<pre><font style="FONT-SIZE: 11pt" color="#330066"><span id="style" style="LINE-HEIGHT: 20px">
文字
文字
5. 最後是歌曲的路徑和語法，不過我這個播放器和傳統的不太一樣，用無名的flash再加上顏色變化，為了美化和調整了播放器的底色以作搭配
<embed src="http://pic.wretch.cc/photos/serv/video/video_player/BGMusicPlayer.swf?file=http://f7.wretch.yimg.com/bettyfon1688/33/1384361725.mp3&backcolor=0xedffed&frontcolor=0xffffcc&lightcolor=0xac8fc90&volume=50&autostart=true&showdigits=true&repeat=true" width="155" height="20" type="application/x-shockwave-flash" allowscriptaccess="none" />
6. 最後千萬別忘了要加上這些和以上語法相對應的語法做結束，不然版面可是會亂掉喔~
</span></font></pre></div></div></td></tr></tbody></table></center></center>
這樣就大功告成啦，這其實是最早大家在玩的語法，不過韓網有時常會失聯，也不太穩定，所以一般我很少用，除非你自己把檔案下載後，再上傳到自己空間，不然網誌出現一片空白，是經常有的事~
(Div、Span)
語法 | 實例 | 說明 |
width (指定區塊的寬度) | width:20px | 20px(直接給定一個值)、30%(利用百分比)、auto(讓瀏覽器幫你調整) |
height (指定區塊的高度) | height:20px | 20px(直接給定一個值)、30%(利用百分比)、auto(讓瀏覽器幫你調整) |
position (位置) | position:absolute | 區塊的座標位置，可以套用absolute(絕對)、relative(相對)，絕對的意思是，基準點位於網頁的最左上角，而相對的意思，基準點則是位於上一個被定義區塊的最左上角。 |
top (上端位置) | top:100px | 以基準點為準，正值代表在基準點的下方，負值代表上方 |
left (左側位置) | left:100px | 以基準點為準，正值代表在基準點的右方，負值代表左方 |
z-index (用來垂直螢幕高度) | z-index:100 | 指定區塊垂直螢幕的高度 |
visibility (用來設定顯示與否) | visibility:visible | 可以套用visible(顯示)、hidden(隱藏) |
用來設定是否產生捲軸) | overflow:auto | 當區塊中的元件比我們設定的區塊還大時，就產生是否產生捲軸的問題，可以套用auto(當元件大於區塊時，自動產生捲軸)、scroll (不論元件大小，一律產生捲軸)、hidden(不論元件大小，一律不產生捲軸，所以超出區塊的部份就會隱藏不顯示)、visible(若元件大於區塊，則區塊自動撐大) |
margin (用來設定區塊與外界之間留白的大小) | margin:3px 4px 2px 5px margin-top:3px margin-right:4px margin-bottom:2px margin-left:5px | 一次設定四個邊與外界之間的留白大小，依序是上、右、下、左；或是單獨設定。 |
padding (用來設定元件與區塊邊緣之間留白的大小) | padding:3px 4px 2px 5px padding-top:3px padding-right:4px padding-bottom:2px padding-left:5px | 可以一次設定四個方向留白大小，依序是上、右、下、左；或是單獨設定。 |
本文於 修改第 1 次
本城市首頁
看回應文章
等級：8
回應給：
