Profiel van 淡水鱼淡水鱼,,平平淡淡,,安安静静,,Foto'sWeblogLijsten Extra Help

Weblog


    在Windows Media Player中放置ALL-IN-ONE撥放器

    過去在MSN Spaces5中,多人對Windows Media Player撥放器,功能限制又恨又愛。
    *常常遇到以下問題:
    *網路空間,那裡有?
    *連結要怎麼找?
    想放影片音樂...等雜七雜八東西。
    現在介紹STICKAM ALL-IN-ONE撥放器,將圖片、影片、音樂、視訊、聊天室結合在一起,而且還有選單目錄,撥放器背景跟顏色都可以自訂,果然ALL-IN-ONE不是隨便取的。而且提供500MB大容量對一般使用者苦沒網路空間使用,算是一大福音,總算可以規劃自己的音樂影片檔案,不用當網路游牧民族了。

     

     
     
     
     提醒1:

    如果看不到FLASH撥放器請下載FLASH附加元件Get Macromedia Flash Player Get Macromedia Shockwave Player

    或者XP的使用者把Windows Media Player升級到 Windows Media Player10 (按這下載頁面)

     
     

    壹、申請方法:

     
    進入STICKAM 網頁(按這)填寫基本資料:
     提醒2:用Hotmail 或 Gmail的信箱,會比較認證信會比較快收到。
     
     
     
     

    貳、操作使用

     
     
    一、圖片:
     
     
      限制:
      1.限JPG檔。
      2.檔名限字母跟底線不能用空白(但測結果支援中文檔名)。
      3.每個檔案最大不超過5MB。
      說明:
     
     
     
     
     
     
    二、音樂:
     
     
      限制:
      1.限Wav,MP3檔案。
      2.每個檔案最大不超過100MB。
     
     
     
    三、影片:
     
     
      限制:
      1.限avi、mov、wmv、3gp、mpeg檔。
      2.每個檔案最大不超過100MB。
      3.影片大小320 x 240 或是 160 x 120。
     
     
      
    如果你有Web/video camera網路攝影機,可以直接錄下自己的影音作品。
    按下RECORD VIEDO/AUDIO(如下圖)可以馬上錄製:
     
     
     
     
     四、視訊聊天
     
     
     
     
     
     
     
     
     

    参、設定播放器介面:

     
     
      因為原定的撥放器為長條型,不適合在Windows Media Player撥放器中使用,
      且第一個播放器不能更改大小,必須新增一個才能變更大小樣式。
      如下圖設定:
     
     
     

    肆、放入Windows Media Player撥放器中

     
     
      取得連結後,如下
     
     
      以上還不能使用,必需修改成如下連結:
     
     
      放入Windows Media Player撥放器中,的"URL"中,Save完成。
     
      提醒3:
      如果沒有Windows Media Player請點選Windows Media Player按照教學安裝。
     
     
     
     

    伍、補充設定:

     
      1、MSN Spaces的Windows Media Player:
        Auto Start:打勾,這樣一開網頁就會自動顯示。
        Display Mode:設定"none",底下的播放控制就不會顯示。
     
      2. STICKAM ALL-IN-ONE撥放器的設定:
      +Movie自動播放:在STICKAM 網頁登入後,按下【My Page】→按下【EDIT PREFERENCE】進入EDIT PREFERENCE網頁後選擇【Movie】→按下【Save】儲存
     
     3.上傳檔案有問題的可以使用E-Mail傳送。
    使用"壹、申請方法"的圖中 Edit Profile(第8步驟)中間Wireless Phone E-mail Address的自己設定的E-Mail傳送檔案。
    傳送到: post@go.stickam.com
    傳送過去後,檔案自然出現在,應該出現的位置。(例:音樂檔案就會出現在音樂網頁)
     
     
     4.關於看不到播放器的問題,已經在上面第一個提醒1已經說明,請仔細看。
        經再一次特別提醒還是有人詢問,特地複製下來,這樣應該很清楚了。
     
    提醒:

    如果看不到FLASH撥放器請下載FLASH附加元件Get Macromedia Flash Player Get Macromedia Shockwave Player

    或者XP的使用者把Windows Media Player升級到 Windows Media Player10 (按這下載網頁)

    鼠标效果

    註:4/3現在使用右邊會變成黑色,請勿再使用。
              我使用的方法不是這個(更難用更複雜)................
        4/4 已修正
        5/31 感謝atiger再度修正,真正全頁背景。
        6/7   增加修改滑鼠樣式
     
    註2:會有空隙的現象,是正常的現象。
             可利用障眼法,選擇與空隙相同的色系的背景可以使空隙看不出來。
    網誌背景很多人問,在atiger公佈一個方法,修改一下添加"首頁訊息提示"的功能,給大家使用。
     
     
    方法簡單說明,如下圖:
    注意:如發生錯誤請盡快移除Custom HTML中所有語法。
     
     
    Custom HTML中輸入的語法:
     
    </table></table></td></tr><tr><td><table title="文字"  width=1000 background="圖片連結"  style="cursor:滑鼠樣式"><tr><td><table><table>
     
     
    說明:
     
     title="文字"                       滑鼠在首頁停止時,出現的提示文字 
                                                &#10; 代表換行
    background="圖片連結"    圖片連結換上你自己的背景圖片連結
    style="cursor:滑鼠樣式"    滑鼠可以改變內定的滑鼠樣式
                                                例:style="cursor:hand" 
                                                其他樣式如下:
                                                                        hand             手指
                                                                        text              箭頭平行
                                                                        move            移動游標
                                                                        crosshair      十字架
                                                                        help              問號
                                                                        wait              漏斗
                                                                        n-resize        箭頭往上
                                                                        s-resize         箭頭往下
                                                                        w-resize        箭頭往左
                                                                        e-resize         箭頭往右
                                                                        ew-resize       箭頭左下
                                                                        se-resize        箭頭右下
                                                                        ne-risize         箭頭右上
                                                                        nw-risize        箭頭左上
     
     
     
    語法範例(直接複製使用):
     
    </table></table></td></tr><tr><td><table title="大家好"  width=1000 background="http://myurl.com.tw/ocjo"><tr><td><table><table>       
     
     
     
    注意:
    1.此語法對MSN Spaces結構有破壞性,請小心使用。
    2.部落格(網誌/日誌) 有非對稱性<Table> 結構的語法,會讓首頁錯亂。
    3.使用者必須自己承擔風險,本空間無責任負責。
     
     

    5/31 部落格 跟 模組都會有一致性的背景,但是,跟 佈景主題 的不同效果也不同。
       如果系統出現奇怪的現象,屬正常狀況。不喜歡可以移除語法。
     
    Custom HTML中輸入的語法:
     
    </table></table></td></tr><tr><td><table title="文字"  width=1000 background="圖片連結"><tr><td style="Filter:Chroma(color=背景顏色); cursor:滑鼠樣式"><Table><Table><tr><td><Table>
     
    說明:
     
     title="文字"                       滑鼠在首頁停止時,出現的提示文字 
                                                &#10; 代表換行
    background="圖片連結"    圖片連結換上你自己的背景圖片連結
     
    color=背景顏色                 背景顏色改成部落格(網誌/日誌)的背景顏色。
               我的空間是背景是黑色,則我的背景顏色為#000000,因此我的語法為color=#000000  
                                                如果不知道背景顏色可以參考利用MouseZoom(點我)查詢。
    style="cursor:滑鼠樣式"    滑鼠可以改變內定的滑鼠樣式
                                                例:style="cursor:hand" 
                                                其他樣式如下:
                                                                        hand             手指
                                                                        text              箭頭平行
                                                                        move            移動游標
                                                                        crosshair      十字架
                                                                        help              問號
                                                                        wait              漏斗
                                                                        n-resize        箭頭往上
                                                                        s-resize         箭頭往下
                                                                        w-resize        箭頭往左
                                                                        e-resize         箭頭往右
                                                                        ew-resize       箭頭左下
                                                                        se-resize        箭頭右下
                                                                        ne-risize         箭頭右上
                                                                        nw-risize        箭頭左上
              
     
     

    文字美化

    文字美化代码

    <font style="text-decoration:line-through">刪除線</font>
    刪除線

    <FONT style="BACKGROUND-COLOR: #ffddff">加上背景色</FONT>
    加上背景色

    <font style="filter:FlipH;height:10pt;">左右翻转效果</font>
    左右翻转效果

    <font style="filter:FlipV ;height:10pt;">上下翻转效果</font>
    上下翻转效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#4A7AC9,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#FF0000,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#FF0080,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#FF8000,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#008080,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#0000FF,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#8000FF,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 9pt; FILTER: Glow(color=#000000,strength=2); COLOR: #ffffff; HEIGHT: 9pt">发光文字效果</FONT>
     发光文字效果

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#4A7AC9,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp;</FONT>投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#FF0000,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#FF0080,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#FF8000,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#008080,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#0000FF,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#8000FF,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#000000,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>投射阴影文字效果&nbsp;&nbsp; </FONT>
    投射阴影文字效果  

    <font style="FILTER:Dropshadow(color=#cccccc,offX=3,offY=3); height=1px">阴影文字效果</font>
    阴影文字效果

    <DIV style="WIDTH: 80px; HEIGHT: 19px; BACKGROUND-COLOR: #cccccc"><FONT style="FILTER: Dropshadow(color=#FFFFFF,offX=1,offY=1); HEIGHT: 15pt" color=#000000>&nbsp;雕刻文字效果</FONT></DIV>

     雕刻文字效果

    <DIV style="FONT-SIZE: 14pt; FILTER: Wave(freq=17,strength=3,lightstrength=1,phase=0); WIDTH: 125px; LINE-HEIGHT: 15pt; FONT-FAMILY: Verdana; HEIGHT: 20px" align=left>
    <FONT color=#ff8000><STRONG><B>扭曲文字效果</B></STRONG></FONT></DIV>

    扭曲文字效果

    阴影:<FONT style="COLOR: #xxxxxx; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>日志文字</B></FONT>

    。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。

     

    中文直書:  <div style="writing-mode :tb-rl;width:◆px;height:◆px">內容擺這</div>
    效果:

    內容擺這

     

     

    上下翻轉: <font style="filter:FlipV ;height:10pt;">顯示效果預覽文字</font>

    效果: 顯示效果預覽文字

     

    发光: <FONT style="COLOR: #xxxxxx; FILTER: glow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>日志文字</B></FONT>

    效果: 。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。

     

    光晕效果的代码:<DIV style="FILTER: glow(color=#ff6600,strength=6); COLOR: #000000; HEIGHT: 10px"><FONT size=6>光晕效果</FONT></DIV>

    光晕效果---。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。

     

    渐变效果代码

    <P align=center><FONT style="FONT-SIZE:30pt;filter:alpha(opacity=100,style=1);WIDTH:100%; COLOR:red;LINE-HEIGHT:100%;FONT-FAMILY:华文行楷"><B>。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。 </B></FONT></P>

    opacity属性:设置透明度,取值0至100之间的任意数值,100表示完全不透明;

    style属性:设置渐变风格,0表示均匀渐变,1表示线性渐变,2表示放射渐变,3表示直角渐变。

    width:100%则表示参与渐变的对象的宽度,通常都设置为100%。


     。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。

     

    带颜色阴影效果:

    <P align=center><FONT style="FONT-SIZE: 20pt; FILTER: dropshadow(color=#228B22,offX=5,offY=3,Positive=1); WIDTH: 100%; COLOR: #ff7f50; LINE-HEIGHT: 150%; FONT-FAMILY: 华文行楷"><B>带颜色阴影效果-。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。 </B></FONT></P>

    带颜色阴影效果-。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。


     

     


    波纹字体代码:

    <FONT style="FONT-SIZE: 30pt; FILTER: wave(add=0,lightstrength=50,strength=3,freq=2,phrase=10); WIDTH: 100%; COLOR: red; LINE-HEIGHT: 100%; FONT-FAMILY: 华文行楷"><B>波纹字体。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。 </B></FONT>


    add属性:布尔型,0或1,0表示将原始对象加入最后效果中,1则反之;
    freq属性:决定显示的频率,即应出现多少个波形;
    phrase属性:决定波形的形状,值取0至360之间;
    strength属性:决定波形的振幅。

     

    波纹字体。◕‿◕。┢┦aΡpy幽の魔法素材屋。◕‿◕。
    添加评论
    在 WMP.P.Toy 使用 Flash MP3 Player 播放多首音樂
    主旨: 在 WMP.P.Toy 使用 Flash MP3 Player 播放多首音樂 
    • 最近常常有人問,WindowsMediaPlayerPowerToy模組(WMP.P.Toy)是否能播放多首音樂,答案當然是可以的,雖然網址只能填一個,但前陣子已經有網友使用清單的方式實現了,還有另外一種方法也是可行的,那就是以下要說明的Flash型的播放器。
    • 注意:只能使用mp3檔案。

      Flash MP3 Player 設定教學:

    1. 這個Flash MP3 Player 的作著是源於著個網站
      http://www.jeroenwijering.com/?item=Flash+Mp3+Player
      此網站提供網友的Flash MP3 Player規格較大,對於要使用較小的WMP.P.Toy的可能會擠不下也不好看,所以網站也提供原始檔讓大家可以一自己喜歡的樣式修改,前幾天小綠人改出了一個較符合WMP.P.Toy大小的Flash MP3 Player讓有興趣的人使用。


       
    2. 首先先下載(右鍵另存新檔) mp3player.wmv (主播放器) 和 mp3player.xml(音樂曲目檔)
      下載完成後,使用記事本(notepad.exe)開啟mp3player.xml (此檔不得任意改檔名)


      修改方式如下:
      說明 <?xml version="1.0" encoding="UTF-8"?>
      <player showDisplay="yes" showPlaylist="yes" autoStart="no">
      <song path="mp3音樂網址" title="音樂顯示名稱">
      <song path="mp3音樂網址" title="音樂顯示名稱">
         :
         :
         :
      </player>
       
      1. autoStart="參數"

        參數設為yes即是自動播放。
        參數設為no即是不自動播放。
        參數設為random即是隨機自動播放。
         
      2. <song path="mp3音樂網址" title="音樂顯示名稱">
        是紀錄音樂項目的地方。
        加上幾行<song path=.......>就能撥幾首音樂。(沒有數量限制)

      範例

      <?xml version="1.0" encoding="UTF-8"?>
      <player showDisplay="yes" showPlaylist="yes" autoStart="no">
      <song path="http://gene7299.castpost.com/14.mp3" title="MY HEART WILL GO ON" />
      <song path="http://gene7299.castpost.com/15.mp3" title="HYMM TO THE SEA" />
      </player>


      這個範例即是不要自動播放(no),因為加上兩行<song path...>所以可以撥兩首音樂。

      改完請儲存檔案。

       
       

    3. 接著把mp3player.wmv(不用修改) 和已修改好mp3player.xml上傳到你的網站上(可以使用CASTPOST的空間)

      (如果您使用CASTPOST就預設是相同目錄,所以可以不用去注意檔案必須放在相同目錄,不同目錄會讀取不到音樂曲目檔的。)

       
    4. 上傳完畢,最重要的動作,就是把mp3player.wmv的網址(捷徑)貼到WMP.P.Toy裡的URL就行了。
      之後mp3player.wmv會顯示主播放器並自動讀取mp3player.xml裡的音樂檔播放。

    5. Flash MP3 Player相關檔案下載:(10/10修改檔案)

      FLASH播放器 http://gene7299.castpost.com/mp3player.wmv
      XML音樂清單 http://gene7299.castpost.com/mp3player.xml
      FLASH原始檔 http://gene7299.castpost.com/mp3player.fla

       
    6. 但如何得到mp3player.wmv的網址和mp3音樂網址 ?  請繼續往下看


       

      使用CASTPOST上傳Flash MP3 Player和mp3音樂檔案教學:

    1. 先到這個
      (按圖進入網站)
      網站申請一個帳號.....

       


    2.  
    3. 輸入登入的E-mail 和登入密碼


       
    4. 輸入對應網址


       

    5.  
    6. 輸入登入的E-mail 和登入密碼


       
    7. 登入之後再來就是上傳檔案了...
      網站右上角按 add item
       
    8. 輸入Title 和 按Browse選擇將要上傳檔案
      (檔案路徑不能有中文,否則會失敗,會顯示成"You need to enter a title for your item. ")

      -->接著按Add item上傳(出線過程條)

      PS.在此先上傳mp3player.wmv



       
    9. 上傳完畢之後,網站右邊出現如下的情形

      檔案網址就在download 按 右鍵複製捷徑(Copy Shortcut) --> 貼到WMP.P.Toy的URL裡(如下圖)
      (檔案網址會類似這樣 http://你在CASTPOST的帳號.castpost.com/mp3player.wmv)


       
    10. 接著mp3player.xml也上述方式上傳(光有播放器不行吧.音樂目錄檔也要傳喔)
      也就是說mp3player.wmvmp3player.xml都上傳才算完成。

       
    11. 當然你可以用此網站把你的音樂上傳到這。(共100MB可以使用)
      這樣你就有
      <song path="mp3音樂網址" ...>的mp3音樂網址了^^

    Q&A:

    1. 我下次還要新增歌曲怎麼辦?
      ANS:不要動WMP.P.Toy的URL裡的mp3player.wmv,只要先刪除CASTPOST裡的mp3player.xml檔,再去記事本打開mp3player.xml新增歌曲,在把改完之後的mp3player.xml上傳即可。
       
    2. CASTPOST免費空間有時連不到,看不到Flash MP3 Player,還會出現"too many connections" 應該怎麼辦?
      ANS:既然是免費的空間,就無可避免有連線過量的問題,而且CASTPOST規模沒有像MSN這麼大,所以只能等他們升級硬體設備了。要不然你可以自行尋找另外的網頁空間等等,操作過程都是大同小異的。(使用別的空間要注意相同目錄問題)
       
    3. 我沒有WMP.P.Toy(Windows Media Player)?
      ANS:請看Windows Media Player PowerToy 教學

    修改首頁背景和添加首頁文字提示

    網誌背景很多人問,在atiger公佈一個方法,修改一下添加"首頁訊息提示"的功能,給大家使用。
     
    方法簡單說明,如下圖:
    注意:如發生錯誤請盡快移除Custom HTML中所有語法。
     
     
    Custom HTML中輸入的語法:
     
    </table></table></td></tr><tr><td><table title="文字"  width=1000 background="圖片連結"><tr><td><table><table>
     
     
    說明:
     
     title="文字"                       滑鼠在首頁停止時,出現的提示文字 
                                                &#10; 代表換行
    background="圖片連結"    圖片連結換上你自己的背景圖片連結
     
     
     
    語法範例(直接複製使用):
     
    </table></table></td></tr><tr><td><table title="大家好"  width=1000 background="http://myurl.com.tw/ocjo"><tr><td><table><table>       
     
     
     
    注意:
    1.此語法對MSN Spaces結構有破壞性,請小心使用。
    2.部落格(網誌/日誌) 有非對稱性<Table> 結構的語法,會讓首頁錯亂。
    3.使用者必須自己承擔風險,本空間無責任負責。
     
     

    之前想過利用.m3u或.asx格式製作播放清單,測試失敗,原因副檔名不支援,後來在百無禁忌中看到如何实现space多个音乐自动连续播放看到修改副檔名media player可以支援的副檔名格式,就可以使用。

    之前想過利用.m3u或.asx格式製作播放清單,測試失敗,原因副檔名不支援,後來在百無禁忌中看到如何实现space多个音乐自动连续播放看到修改副檔名media player可以支援的副檔名格式,就可以使用。
     
     
     
    一、首先要先了解: 
    1.以下所有音樂連結必須使用Windows Media Player可以接受的影音格式和連結,找到連結必須符合以下範例
      範例:http://spaces.msn.com/members/young59tw/music.mp3
      除了http://也可以使用mms://
      除了.mp3可也可以使用 .wmv,.wma,.wav,.avi,.mpg,.mpeg影音格式。
      除了這些格式,像其他.swf,.asx,.m3u,.rm....etc都不支援。
    2.請確認加入的影音檔是否有效連結請參考"自我檢查圖片、影片音樂檔案連結是否失效~"。
    3.網路空間請參考"放音樂圖片的網路空間"。
    4."記事本"(文字文件 或者 文本文档)另外啟動方式:Crle+Esc → R→ 輸入"Notepad"→ 確定
    5.如果檔案沒有副檔名,請按這顯示副檔名教學
    6.檔案名稱的定義:自我檢查圖片、影片音樂檔案連結是否失效~"的補充 
    7.文件只能上傳網路空間後才能使用,檔案直接在電腦裡使用會出現檔案錯誤訊息。 (很多人漏看這一點)
     
     
     
    二、製作播放清單 
    製作播放清單有兩個格式分別.m3u跟.asx編寫方式選擇其中一種使用
    建議用第一種作法,簡單好用,成功率高~
     
    利用WIMAMP使用的.m3u格式編寫播放清單(建議初學者跟怕麻煩的使用):
    這做法簡單,只要用記事本編輯後,把音樂連結一首接著一首依序貼上,修改檔名就可以完成。
    作法如下圖:
     
     
    1.文字文件俗稱記事本
    2.當記事本的檔案名稱是這樣的格式『文字文件.txt』修改 『文字文件.wma』
       重點在於副檔名『txt』改成『wma』。(如果沒看到副檔名請按這)
     
     
    利用Windows Media Player使用的.asx格式編寫播放清單:
    作法跟.m3u相同,差別在於輸入的內容不同,編寫內容較複雜,適合進階網友研究使用。這種寫法如果失敗建議用以上第一個.m3u方法,效果一樣。
    編寫內容如下圖: 

        <ASX Version = "3.0">
          
    <Entry> <Ref href = "第一首音樂連結"/> </Entry>
          <Entry> <Ref href = "第二首音樂連結"/> </Entry>
          <Entry> <Ref href = "第三首音樂連結"/> </Entry>
          <Entry> <Ref href = "第四首音樂連結"/> </Entry>
          </ASX>

     

    1.紅色部分(<Entry> <Ref href = "第一首音樂連結"/> </Entry>)依自己需求,增加或減少。

    2.其他進階用法,如編輯主唱、歌曲名稱、版權宣告、廣告..等資訊請參.asx 檔的內容Windows Media Metafile Elements ReferenceWindows Media 元文件简介

     

     

     

    三、上傳檔案取得連結

    得到music.wma的檔案,在自己的電腦不能使用,必須上傳網路空間(按這可以找),取得檔案路徑。

    例如:http://spaces.msn.com/members/young59tw/music.wma

    填上Windows Media Player模組(添加方式按這)中URL欄位,點選"Save"完成。音樂會依照添加順序播放,可以點選播放器中的 選擇歌曲。

    註1:在Windows Media Player模組Display Mode設定FULL就會有 選項出現。

    註2:台灣PCHOME,台灣YAHOO,會限制影音檔案,所以不能使用。

          HINET的所提供的60MB免費空間,對某些地區頻寬不足,致某地會看不到圖片,聽不到音樂。
     
     
     
     

    簡單使用讓文章加上捲軸

    簡單使用讓文章加上捲軸

    很多人問讓文章怎麼使用捲軸怎麼使用,捲軸語法太過於複雜,以致很多人當場昏倒在電腦前。當我清醒時,決定好好學這捲軸。這是我做的筆記,希望對大家有所幫助。

    以下分成三部份1是主要的部分,2 或 3 依自己的需求選擇使用,也可以完全不使用。至於4參考用。


    注意: 以下編輯都是在"編輯網誌內容"(?點我)模式裡的"<HTML>模式"(?點我)中進行。

             請注意" : " " ; "和 "空格" 的位置,以免失敗。

     

    1.基本捲軸

    HTML語法:

    <DIV style="OVERFLOW: scroll;  HEIGHT: 60px; background-color: #996600">編輯文字圖片內容</DIV>
     
     
    效果(基本):
    編輯文字圖片內容(內容區域)

     ↑捲軸外圍包含的區域為 顯示區域

     
    用法:
    (替換語法時,注意style=""中的內容,每一部分用"分號 ;"隔開,接著空一格。)

    1.當"內容區域"大於"顯示區域"時,可利用捲軸讓看見超出範圍的內容。利用滑

       鼠游標調整"顯示區域",滑鼠游標點選捲軸,會變成可調整大小的狀態,可隨

       欲的調整大小,語法中的width和height也會隨著變。

       PS:去除width:10px的元素,寬會自動擴展到最大。

     

    2.語法( OVERFLOW: scroll )為顯示右方下方捲軸。整個還可以分別替換成

      ( OVERFLOW: auto ) : "內容區域"大於"顯示區域"會自動顯示捲軸,建議使用。

      ( OVERFLOW: scroll; OVERFLOW-X: hidden ): 刪除水平→捲軸。

      ( OVERFLOW: scroll; OVERFLOW-Y: hidden ): 刪除垂直↑捲軸。

      ( OVERFLOW: hidden) : 不使用捲軸。

     

    3.語法( background-color: #996600 )為框框內的背景顏色,#996600 部分為16進位顏

      色碼(?),可在查詢 4096 Color Wheel ,記得要加上"#"。

      PS.整段刪除,背景變成透明狀態。

     

     

     


    2.為捲軸加外框

    基礎語法(見上面1.基本捲軸)中,在style="__"中,在__的地方加入( BORDER: #ff0000 5px dotted )

    情況如下(加入的語法為畫底線):

    HTML語法:

    <DIV style="OVERFLOW: scroll;  HEIGHT: 60px; background-color: #996600; BORDER: #ff0000 5px dotted">編輯文字圖片內容</DIV>
     
     
    效果(基本+外框):
    編輯文字圖片內容
     
    加入後,切換編輯列上"<HTML>"(?點我)兩次後,在回到"<HTML>模式"(?點我)中就會
    見到( BORDER: #ff0000 5px dotted )被拆成四部份分別BORDER-RIGHT(右邊框),BORDER-TOP(上邊框),BORDER-LEFT(左邊框), BORDER-BOTTOM(底邊框)變成
    (BORDER-RIGHT: #ff0000 5px dotted;
     BORDER-TOP: #ff0000 5px dotted;
     BORDER-LEFT: #ff0000 5px dotted;
     BORDER-BOTTOM: #ff0000 5px dotted )
     
    用法:
    (BORDER: #ff0000 5px dotted)或(BORDER-RIGHT: #ff0000 5px dotted; BORDER-TOP: #ff0000 5px dotted; BORDER-LEFT: #ff0000 5px dotted; BORDER-BOTTOM: #ff0000 5px dotted )都有共同結構,分析如下:
     
    ( BORDER: #ff0000 5px dotted ) 
     
    (#ff0000)框的顏色,#996600 部分為16進位顏色碼(?),可在查詢
        4096 Color Wheel ,記得要加上"#",依框的屬性上下左右可調整不同顏色。
    (5px):框的大小,數字越大,框就越粗。0為無框。 

    (dotted):框的類型,(dotted)為"點"的型態,可替換其他的有 實線:( solid ),

        虛線:( dashed ),立體內凸框:(groove),立體浮凸框: (ridge),

        雙實線: (double),凹框: ( inset),凸框: (outset),依框的屬性可調整上下左

        右使用不同屬性的框

     

     

     


    3.為捲軸調色:

    首先取得{捲軸顏色語法}內容可以用捲軸顏色產生器取得,捲軸顏色產生器網址如下:

    捲軸顏色產生器

    捲軸顏色編輯器

    自動捲軸配色編碼器

    捲軸顏色生成器

    捲軸顏色產生器編輯完成後會得到如下語法:

    <style>
    BODY {
    SCROLLBAR-FACE-COLOR: #00ffff;
    SCROLLBAR-HIGHLIGHT-COLOR: #ffff00;
    SCROLLBAR-SHADOW-COLOR: #777777;
    SCROLLBAR-3DLIGHT-COLOR: #ff0000;
    SCROLLBAR-ARROW-COLOR: #00ff00;
    SCROLLBAR-TRACK-COLOR: #770000;
    SCROLLBAR-DARKSHADOW-COLOR: #ff00ff;
    SCROLLBAR-BASE-COLOR: #0000ff
    }
    </style>

    複製以上所需要反白部份,此反白部份為捲軸變色的語法。在基礎語法(見上面1.基本捲軸)中,在style="__"中,在__的地方加入反白部份。注意,每一部分用"分號 ;"隔開,接著空一格。得到的結果如下(加入的語法為畫底線): 

     

    HTML語法

    <DIV style="OVERFLOW: scroll;  HEIGHT: 60px; background-color: #996600; BORDER: #ff0000 5px dotted; SCROLLBAR-FACE-COLOR: #00ffff;
    SCROLLBAR-HIGHLIGHT-COLOR: #ffff00;
    SCROLLBAR-SHADOW-COLOR: #777777;
    SCROLLBAR-3DLIGHT-COLOR: #ff0000;
    SCROLLBAR-ARROW-COLOR: #00ff00;
    SCROLLBAR-TRACK-COLOR: #770000;
    SCROLLBAR-DARKSHADOW-COLOR: #ff00ff;
    SCROLLBAR-BASE-COLOR: #0000ff
    "
    >編輯文字圖片內容</DIV>

     
     
    效果(基本+外框+卷軸顏色):
    編輯文字圖片內容

     

    用法:(可依顏色對應相關位置)

      ■( SCROLLBAR-FACE-COLOR: )拖曳棒與按鈕表面顏色。

      ■( SCROLLBAR-HIGHLIGHT-COLOR: )捲軸與按鈕四周內邊框左上

          立體亮面的顏色。

      ■( SCROLLBAR-SHADOW-COLOR: )捲軸與按鈕四周內邊框右下立

         體暗面的顏色。

      ■( SCROLLBAR-3DLIGHT-COLOR: )捲軸與按鈕四周外邊邊框左上

          立體亮面的顏色。
      ■( SCROLLBAR-ARROW-COLOR: )按鈕箭頭▲▼顏色。

      ■( SCROLLBAR-TRACK-COLOR: )捲軸軌道的顏色。 

      ■( SCROLLBAR-DARKSHADOW-COLOR: )捲軸與按鈕四周外 

          邊框右下立體暗面的顏色。

      ■( SCROLLBAR-BASE-COLOR: )捲軸整體的顏色,單獨使用效果

          比較明顯。
     

     以上的語法後面加上(#777777)為16進位顏色碼(?),可在查詢  4096 Color Wheel

     記得要加上"#"

     

    4.變化應用:

    1.左側拖曳棒

    HTML語法: 

    <DIV style="OVERFLOW: scroll; DIRECTION: rtl; HEIGHT: 60px; BACKGROUND-COLOR: #996600">
    <DIV style="DIRECTION: ltr" align=left>編輯文字圖片內容</DIV></DIV>

    效果:

    編輯文字圖片內容

     

    2.隱形的捲軸(只看的見按鈕箭頭▲▼)

    HTML語法: 

    <DIV style="SCROLLBAR-FACE-COLOR: #996600; SCROLLBAR-HIGHLIGHT-COLOR: #996600; OVERFLOW: auto; SCROLLBAR-SHADOW-COLOR: #996600; SCROLLBAR-3DLIGHT-COLOR: #996600; SCROLLBAR-TRACK-COLOR: #996600; SCROLLBAR-DARKSHADOW-COLOR: #996600; HEIGHT: 60px; SCROLLBAR-ARROW-COLOR:#FF0000; BACKGROUND-COLOR: #996600">編輯文字圖片內容</DIV>

    效果:

    編輯文字圖片內

    編輯文字圖片內

    編輯文字圖片內

    編輯文字圖片內

     

    3.透明的捲軸

    HTML語法: 

    <DIV style="FILTER: Chroma(Color=green); HEIGHT: 1px">
    <DIV style="SCROLLBAR-FACE-COLOR: green; SCROLLBAR-HIGHLIGHT-COLOR: red; OVERFLOW: auto; SCROLLBAR-SHADOW-COLOR: green; SCROLLBAR-3DLIGHT-COLOR: green; SCROLLBAR-ARROW-COLOR: red; SCROLLBAR-DARKSHADOW-COLOR: red; HEIGHT: 60px; BACKGROUND-COLOR: #996600">編輯文字圖片內容</DIV></DIV>

    效果:

    編輯文字圖片內容

     

     

     

    4.發光的捲軸

    HTML語法: 

    <DIV style="FILTER: Chroma(Color=green)glow(color:6666ff,Strength=6); HEIGHT: 1px">
    <DIV style="SCROLLBAR-FACE-COLOR: green; SCROLLBAR-HIGHLIGHT-COLOR: red; OVERFLOW: auto; SCROLLBAR-SHADOW-COLOR: green; SCROLLBAR-3DLIGHT-COLOR: green; SCROLLBAR-ARROW-COLOR: red; SCROLLBAR-DARKSHADOW-COLOR: red; HEIGHT: 60px; BACKGROUND-COLOR: #996600">編輯文字圖片內容</DIV></DIV>

    效果:

    編輯文字圖片內容

     

     

     

     

    5.加上背景的捲軸

    ★背景不跟捲軸移動

    HTML語法: 

    <TABLE width="100%" background=背景圖片連結><TBODY><TR><TD vAlign=top align=left><DIV style="OVERFLOW: auto; HEIGHT: 60px">編輯文字圖片內容</DIV></TD></TR></TBODY></TABLE>

    效果:

    編輯文字圖片內容

     

     

     

    ★背景跟卷軸移動

    HTML語法: 

    <DIV style="OVERFLOW: auto; HEIGHT: 60px"><TABLE width="100%" background=背景圖片連結><TBODY><TR><TD vAlign=top align=left>編輯文字圖片內容</TD></TR></TBODY></TABLE></DIV>

    效果:

    編輯文字圖片內容

     

     

     

     

     

    突破MSNSPACE的格式,實現全版網頁的效果

    很多人一直很好奇這首頁怎麼做到的,這裡面運用很多技巧,其實這語法很多種,挑一個最簡單的介紹給大家。怕麻煩跟有語法恐懼的千萬不要嘗試。
     
    功能:
    1.突破網誌的限制,編輯內容自由度更大。
    2.可保留之前的模組,如相片模組,自訂清單模組,基本資料模組。
    3.首頁不需要因發新文章而做變動,詳細請見下面第五點說明。
    4.只需要原本的單一空間就可以使用,不需要再申請其他空間相互連結。
     
     
    要先知道:
    1.要先會使用<HTML>模式輸入語法。(按這教學)
    2.要先會加入Custom HTML Power Toy模組。(按這教學)
    3.MSN Space版面
    建議使用以下四組
    兩欄對稱兩欄;左窄3 欄,左窄單欄(強烈建議使用單欄)
    空間版面配置必須日誌靠最右邊,Custom HTML在日誌上方,如下圖

    Custom HTML

    二欲隱藏的模組

    首頁日誌

    因為放在的位置模組會被隱藏,所以可以放一些需要用到且不放在首頁中的模組,如相片,自訂清單......等等。其他要顯示在首頁的模組,可以放置的上面或的底下。

    4.因為語法是關閉整個網誌內容,當發新日誌時,可以直接發佈,不會顯示在首頁中。必須靠連結,讓網友知道你發佈新日誌。

    5.也因為如此,首頁日誌必須依照首頁日誌的篇數作更動。例如:首頁的日誌,設定顯示25篇(按這教學),當你發表第25篇時,首頁日誌會被推到下一頁,這時必須複製首頁日誌的內容貼回到首頁中。

    6.版面配置完成後,才開始使用語法,以免發生版面錯亂。配置方式上述第3點。

    7.點選類別選項,會因為Custom HTML中的語法,導致完全看不到內容。 

    警告:此語法非正常用法,使用時,請務必按照步驟做。以免造成,日誌變一半,消失,首頁不能打開...等悲劇發生。萬一真的發生,不需求救,立即把加進去的語法清除,即可以恢復原狀。

     

     

    語法使用共二部份(缺一不可):

    先看圖解,在看說明(點選放大)

     

    一.Custom HTML Power Toy模組的語法(呼叫模組教學)

    作用:關閉整個網誌,實現讓首頁不顯示日期時間的效果。

    1.當看到首頁日誌被推到最下面(下沉現象)時,加入此語法,立即解決。

    2.如果首頁變空白,移除此語法,立刻解決。

     

    </table><table style="display:none"><tr><td><table>

     

     

    二.首頁日誌的語法(以下輸入語法必需在HTML模式中,教學按這)

    首頁日誌在"編輯網誌內容(按這)"裡語法分上中下,

    中間是主要編輯內容首頁想要呈現的東西都在這裡編輯。可隨心所欲編輯,不管版面多大都可以。認為最理想的寬度1000px,可以讓視窗水平捲軸不顯示。

    然後在依序貼上面跟下面的語法。

    編輯順序口訣:中上下

     

    先編輯中間:

    1.先編輯主要首頁日誌的內容。編輯內容可以隨意編輯,無限向右延伸。

    2.編輯內容時,如果需要全頁背景圖可以使用以下語法,紅色為背景圖的寬度,1000px是我認為最理想的寬度。(平鋪背景圖教學按這)

     

    <TABLE width=1000px background="背景圖路徑" border=0>
    <TBODY>
    <TR vAlign=top align=left>
    <TD>在這裡編輯內容</TD></TR></TBODY></TABLE>

     

    註:此步驟2依個人編輯需求使用,如不需要的可以跳到步驟3。

     

     

    上面:

    3.編輯內容完成後,在<HTML模式>中,在第一行的位置輸入以下語法。

      作用:在於脫離網誌的架構,避免被語法關閉,也可以突破現有版面的限制。

     

    <PRE></table></table></table></table>

     

     

    下面:

    4.之後再<HTML>模式中,在最後一行位置輸入以下語法。

      作用:關閉首頁日誌以下的日誌,實現單篇日誌的架構。(教學按這)

     

    <PRE></TR></Table><TABLE style="DISPLAY: none"><TR><TD><DIV><TABLE></PRE> 

     

    5.當語法輸入完成後,不需預覽(因為預覽看不出效果)立即發佈,回到首頁。此特效立即出現。20050829

     2006/02/04

    對於因為MSN Spaces改版,使用以上第2點表格語法底下會出現空白的現象。請在以上的語法前面加上<TABLE>如變成以下語法。就會改善空白現象。如果沒使用第2點語法請勿使用。

     

    <TABLE><PRE></TR></Table><TABLE style="DISPLAY: none"><TR><TD><DIV><TABLE></PRE> 

     

     

     

     

    補充Q&A:

    Q1.編輯完之後在預覽空間時,會看不到自己的日誌,怎麼查閱自己的日誌??怎麼找到已發佈日誌的連結??

    A1:在預覽自己的空間,點選空間上面的"網誌"的選項,就可以看到已

    發佈的日誌,日誌連結在每篇日誌下面(在時間的右邊)的"永久連"。

    但首頁日誌以前的文章,請解除語法,處理之前的文章,處理完畢,記得把語法加回去。

     

    Q2.怎樣把模組(如:相簿,Media player)放在最右邊?

    A2:使用以下的版面,把要顯示在最右邊的模組放在右邊窄欄的位置,

    兩欄;右窄但注意這容易發生錯誤,使用前最好在另外的空間測試,等熟

    悉之後再使用在自在自己的空間。

     

    Q3.MSN Space編輯網誌內容時,可視範圍過小,很不方便怎麼辦??

    A3:可以先在"原網誌編輯工具網址"編輯,但注意這沒有儲存功能,還有編輯完後必須要複製貼在MSN Space日誌裡,還有重要的是編輯後還是要在MSN Space裡再修正編輯一次,才能到符合需求。

    原網誌編輯工具網址(by gene7299):

    http://spaces.msn.com/RteCode.aspx?mkt=zh-tw (台灣繁體中文版)
    http://spaces.msn.com/RteCode.aspx?mkt=zh-cn (中國簡體中文版)
    http://spaces.msn.com/RteCode.aspx?mkt=zh-hk (香港繁體中文版)
    http://spaces.msn.com/RteCode.aspx?mkt=en-us (美國英文版)
    http://spaces.msn.com/RteCode.aspx?mkt=ja-jp  (日本語)

    (底下有HTML模式可以勾選,複製HTML代碼才能確實完整複製所編輯的內容,並利用  Ctrl+A (全選) 再按 Ctrl+C (複製) 還有 Ctrl+V (貼上) 簡便的快速鍵)20050905

     

    Q5.為什麼首頁的連結(日曆的2005/12連結),進去的頁面跟首頁一樣全畫面網頁效果??

    A5:眼尖的人,仔細觀察MSN的空間,就會發現點選[類別],進去的版面跟首頁一樣。正好我們可以裡用這點來製作像首頁全畫面的效果。

    利用開一篇網誌設定單獨的類別,利用類別狀態如跟首頁異樣實現另一個全畫面。

    一定要符合下面三點缺一不可:

    1.從[永久連結]進入單篇日誌,點選[類別],進入類別畫面後,抬頭看IE瀏覽器的網址就是類別連結。

    註:進入首頁類別時,會看不到內容(或只有Custom HTML),這是因為Custom HTML裡面的語法導致(上面也提過語法作用:關閉整個網誌)。

     

    2.被連結的單獨類別日誌,也要使用上面教學(二.首頁日誌的語法)的語法。

     

    3.被連結的類別日誌不能在首頁,如果同時在首頁,變成使用語法後,會跟首頁日誌同時出現在首頁。

    舉例:如果首頁設定顯示25篇日誌,被連結的類別日誌要在第26篇以後。

     

     


     PS.以上用法對MSN Spaces非正常使用,目前雖然沒有發現任何後遺症,但未來有什麼後果,恕不負責。

    轉貼文章必須註明" ╮(╯▽╰)/夢與天堂の空想世界~" " http://spaces.msn.com/members/young59tw

    利用coComment!追蹤留言

    By (╮(╯▽╰)/夢與天堂の空想世界~http://spaces.msn.com/young59tw/)

    以前常想到自己好像在哪裡留言,但是偏偏一直找不到,每個站每個連結按完了,還是找不到。這實在是精神上的折磨,也對滑鼠鍵傷害不小
     
     
    現在,coComment可以解決這棘手的問題,可以記錄在什麼時候,哪一篇文章,留下什麼什麼內容,紀錄的很清楚,現在不怕找不到自己留言了。而且服務態度不錯,上禮拜MSN Spaces改版,導致coComment不能使用,寫信問coComment客服,幾個小時就回覆,還承諾這禮拜會改善,今天試一下可以使用了,真是感動
    coComment還支援以下
     WordPress TypePad Blogger.com Flickr MySpace Xanga
     MSN Spaces Mojira Kaywa
     
     

    最近比較忙,現在簡單說一下
     
     

    壹、申請與添加coComment工具:

     
    一、.因為必須要Invitation code才能申請,所以在coComment首頁中,Get notified欄位填上E-Mail過了一天一夜就會收到。
     
    二、把Invitation code填入,就可以註冊申請。
     
    三、進入Bookmarklet網頁,把連結,加入我的最愛(或書籤收藏匣)
     
     

    貳、紀錄留言

     
    一、在MSN Spaces進入單篇的網誌寫下你的留言。
          進入單篇網誌方法
          1.對 新增回應 新開視窗(滑鼠右鍵,新開視窗)
          2.點選 永久連結 的連結。
     
     
     
    二、點選我的最愛中的coComment! ,會出現上面有你的帳號才算成功。
    提醒1:第一次使用會出現登入視窗,Cookie紀錄後就不會再出現。
    提醒2:因Cookie失敗的解決方式→開啟IE → 選取功能列上工具(T)網際網路選項隱私權網站網址(W)中填上http://www.cocomment.com/→按下允許(A)→按下確定

     
     
    三、點選發布回應。回到coComment首頁登入,就可以查看你所留言的資料。
     

    在Windows Media Player中放置ALL-IN-ONE撥放器

    在Windows Media Player中放置ALL-IN-ONE撥放器
    *
    By (╮(╯▽╰)/夢與天堂の空想世界~http://spaces.msn.com/young59tw/)

    過去在MSN Spaces5中,多人對Windows Media Player撥放器,功能限制又恨又愛。
    *常常遇到以下問題:
    *網路空間,那裡有?
    *連結要怎麼找?
    想放影片音樂...等雜七雜八東西。
    現在介紹STICKAM ALL-IN-ONE撥放器,將圖片、影片、音樂、視訊、聊天室結合在一起,而且還有選單目錄,撥放器背景跟顏色都可以自訂,果然ALL-IN-ONE不是隨便取的。而且提供500MB大容量對一般使用者苦沒網路空間使用,算是一大福音,總算可以規劃自己的音樂影片檔案,不用當網路游牧民族了。

     

     
     
     
     提醒1:

    如果看不到FLASH撥放器請下載FLASH附加元件Get Macromedia Flash Player Get Macromedia Shockwave Player

    或者XP的使用者把Windows Media Player升級到 Windows Media Player10 (按這下載頁面)

     
     

    壹、申請方法:

     
    進入STICKAM 網頁(按這)填寫基本資料:
     提醒2:用Hotmail 或 Gmail的信箱,會比較認證信會比較快收到。
     
     
     
     

    貳、操作使用

     
     
    一、圖片:
     
     
      限制:
      1.限JPG檔。
      2.檔名限字母跟底線不能用空白(但測結果支援中文檔名)。
      3.每個檔案最大不超過5MB。
      說明:
     
     
     
     
     
     
    二、音樂:
     
     
      限制:
      1.限Wav,MP3檔案。
      2.每個檔案最大不超過100MB。
     
     
     
    三、影片:
     
     
      限制:
      1.限avi、mov、wmv、3gp、mpeg檔。
      2.每個檔案最大不超過100MB。
      3.影片大小320 x 240 或是 160 x 120。
     
     
      
    如果你有Web/video camera網路攝影機,可以直接錄下自己的影音作品。
    按下RECORD VIEDO/AUDIO(如下圖)可以馬上錄製:
     
     
     
     
     四、視訊聊天
     
     
     
     
     
     
     
     
     

    参、設定播放器介面:

     
     
      因為原定的撥放器為長條型,不適合在Windows Media Player撥放器中使用,
      且第一個播放器不能更改大小,必須新增一個才能變更大小樣式。
      如下圖設定:
     
     
     

    肆、放入Windows Media Player撥放器中

     
     
      取得連結後,如下
     
     
      以上還不能使用,必需修改成如下連結:
     
     
      放入Windows Media Player撥放器中,的"URL"中,Save完成。
     
      提醒3:
      如果沒有Windows Media Player請點選Windows Media Player按照教學安裝。
     
     
     
     

    伍、補充設定:

     
      1、MSN Spaces的Windows Media Player:
        Auto Start:打勾,這樣一開網頁就會自動顯示。
        Display Mode:設定"none",底下的播放控制就不會顯示。
     
      2. STICKAM ALL-IN-ONE撥放器的設定:
      +Movie自動播放:在STICKAM 網頁登入後,按下【My Page】→按下【EDIT PREFERENCE】進入EDIT PREFERENCE網頁後選擇【Movie】→按下【Save】儲存
     
     3.上傳檔案有問題的可以使用E-Mail傳送。
    使用"壹、申請方法"的圖中 Edit Profile(第8步驟)中間Wireless Phone E-mail Address的自己設定的E-Mail傳送檔案。
    傳送到: post@go.stickam.com
    傳送過去後,檔案自然出現在,應該出現的位置。(例:音樂檔案就會出現在音樂網頁)
     
     
     4.關於看不到播放器的問題,已經在上面第一個提醒1已經說明,請仔細看。
        經再一次特別提醒還是有人詢問,特地複製下來,這樣應該很清楚了。

    选择喜欢的日志背景颜色

    首先进入 Blog 编辑状态,点击工具栏中的<HTML>按钮,进入 HTML 编辑状态。在编辑框中输入如下语句:

    <div style="width:100%;height:100%;background-color:#FF0000;">
    <p>你要写的文字</p></div>

    然后再次点击<HTML>按钮,返回到正常文本编辑方式,在色块上填上你要写的文字,就可以发布了。其中 background-color (背景色)是可调整的,比如黑色是 #000000,白色是 #FFFFFF,红色 #FF0000,绿色 #00FF00,蓝色 #0000FF ...... 这里有个可以自选网络颜色主题的网站,可以选择自己喜欢的颜色,并得到颜色代码

    在日志里添加视频

    一是利用MS Frontpage,二是使用我提供给你的下面这段语法:

     

    <P><IMG height=150px width=150px loop=infinite dynsrc=流媒体文件链接></P>

     

    IMG后的Height和Width分别控制视频画面的高度和宽度,你可以根据需要自行调整,如果这里你都设置成0的话,那么就只有音乐看不到图像,这也等同于插入背景音乐的效果。Loop控制循环次数,用法可参见上一章的描述。

     

    对于页面中视频位置的控制,可以使用日志编辑器里简单命令,另外也可通过加入下述语法实现视频与文字的完美结合。举例如下:

     

    align=left 文字置于视频的右边,并与其紧密结合
    align=right文字置于视频的右边,并与其紧密结合
    align=top 文字队齐视频顶端
    align=middle 文字队齐视频中部
    align=bottom 文字队齐视频底端

     

    这里关键是流媒体文件的获取,正常的流媒体文件以asf,wmv,或mov等为后缀,这是最直接的形式;也有以asx为后缀的,这种文件格式隐藏了流媒体的真正地址,但没有关系,你一样可以将带有asx后缀的链接放到你的语法中。目前网上多数流媒体文件都隐藏了其链接,很难通过直接的方法来查看,有关这方面的破解技巧网上多有提供,大家可以试试。

    HTML多媒体效果

    插入图形

      超文本之所以在很短的时间内如此广泛的受到人们的青睐,很重要的一个原因时它能支持多媒体的特性,如图象、声音、动画等。这一部分,我们先来学习在一个页面中如何插入图象。

    基本格式

      超文本支持的图象格式一般有X Bitmap(XBM)、GIF、JPEG三种,所以我们对图片处理后要保存为这三种格式中的任何一种,这样才可以在浏览器中看到。
      插入图象的标签是<IMG>,其格式为:

         <IMG SRC="图形文件地址">

      SRC属性指明了所要链接的图象文件地址,这个图形文件可以是本地机器上的图形,也可以是位于远端主机上的图形。地址的表示方法可以沿用上一篇内容“文件的链接”中URL地址表示方法。

      例: <IMG SRC="images/ball.gif">

      IMG还有两个属性是HEIGHT和WIDTH,分别表示图形的高和宽。通过这两个属性,可以改变图形的大小,如果没有设置,图形按原大显示:

      例:

    <IMG SRC="flowers0.jpg">   <IMG SRC="flowers0.jpg" width="200" heigth="100">


    图形与文字的对齐排列:

      由IMG中的ALIGN属性来设置图文的对齐方式,有以下几种:

    ALIGN=top 〈IMG SRC="love.gif" ALIGN=top>美丽的心灵   美丽的心灵 ALIGN=middle 〈IMG SRC="love.gif" ALIGN=middle>美丽的心灵   美丽的心灵 ALIGN=buttom 〈IMG SRC="love.gif" ALIGN=buttom>美丽的心灵   美丽的心灵 ALIGN=texttop 〈IMG SRC="love.gif" ALIGN=textop>美丽的心灵   美丽的心灵 ALIGN=baseline 〈IMG SRC="love.gif" ALIGN=baeline>美丽的心灵   美丽的心灵 ALIGN=left 〈IMG SRC="love.gif" ALIGN=left>美丽的心
    灵,有着数不清的爱心,象天空里的星星,明
    亮晶莹。 美丽的心灵,
    有着数不清的
    爱心,象天空
    里的星星,明
    亮晶莹。 ALIGN=right 〈IMG SRC="love.gif" ALIGN=right>美丽的心
    灵,有着数不清的爱心,象天空里的星星,明
    亮晶莹。 美丽的心灵,
    有着数不清的
    爱心,象天空
    里的星星,明
    亮晶莹。



    图文之间的距离设置:

      在HTML文件里图形水平位置的配置,可由HSPACE属性来完成,其垂直位置的配置,由VSPACE来完成。

    <IMA SRC="love.gif" > 美丽的心灵 <IMA SRC="love.gif" HSPACE=30> 美丽的心灵 <IMA SRC="love.gif" VSPACE=30> 美丽的心灵



    图形按钮:

      图形按钮就是使用者通过在图形上单击,就能连接到某个地址上去。很简单,我们只要调用一下前面的知识就可以完成了。其基本格式如下:

      <A HREF="资源地址"><IMG SRC="图形文件地址"></A>

    例:

      <A HREF="index.htm"><IMA SRC="html.gif"></A>

    播放音乐

      HTML除了可以插入图形之外,还可以播放音乐和视频等。用浏览器可以播放的音乐格式有:MIDI音乐、WAV音乐、AU格式。另外在利用网络下载的各种音乐格式中,MP3是压缩率最高,音质最好的文件格式。

    点播音乐

      将音乐做成一个链接,只需用鼠标在上面单击,就可以听到动人的音乐了,这样做的方法很简单:

       <A HREF="音乐地址">乐曲名</A>

    例如:播放一段MIDI音乐:

       <A HREF="midi.mid">MIDI音乐</A>  MIDI音乐

       播放一段AU格式音乐:

       <A HREF="you.au">同桌的你-AU音乐</A>    同桌的你-AU音乐

      把我们喜欢的音乐收集起来,作成一个音乐库,随时都可以让自己和别人徜徉在音乐的海洋中,已经有人这样做了,你一定已经遇到很多,而且自己也可以试着去做了!

    自动载入音乐

      前面,我们是借助链接来实现网上播放音乐这一功能的,我们还可以让音乐自动载入,你可以让它出现控制面板或当背景音乐来使用。基本语法:

        <EMBED SRC="音乐文件地址">

    属性有:

    SRC="FILENAME" 设定音乐文件的路径 AUTOSTART=TRUE/FALSE 是否要音乐文件传送完就自动播放,TRUE是要,FALSE是不要,默认为FALSE LOOP=TRUE/FALSE 设定播放重复次数,LOOP=6表示重复6次,TRUE表示无限次播放,FALSE播放一次即停止。 STARTIME="分:秒" 设定乐曲的开始播放时间,如20秒后播放写为STARTIME=00:20 VOLUME=0-100 设定音量的大小。如果没设定的话,就用系统的音量。 WIDTH HEIGHT 设定控制面板的大小 HIDDEN=TRUE 隐藏控制面板 CONTROLS=CONSOLE/SMALLCONSOLE 设定控制面板的样子

    例:
    *************************************

    <html>
    <head>
    <title>播放音乐</title>
    </head>

    <body>
      <EMBED SRC="midi.mid" autostart=true hidden=true loop=true>

      作为背景音乐来播放。
    </body>
    </html>

    例:
    *************************************

    <html>
    <head>
    <title>播放音乐</title>
    </head>

    <body>
      <EMBED SRC="midi.mid" loop=true width=145 height=60>

    <P>  出现控制面板了,你可以控制它的开与关,还可以调节音量的大小。</P>
    </body>
    </html>

    IE中的背景音乐

      另外,还有一种插入背景音乐格式,不过只有在IE浏览器中才可以听到。

      <bgsound src="音乐文件地址" loop=#>

       #=循环数

    例:
          <bgsound src="sound.wav" loop=3>

    播放视频

      用浏览器可以播放的格式有:MOV格式、AVI格式。

    链接一个视频文件

      将视频文件做成一个链接的方法:

       <A HREF=" 视频地址">视频名称</A>

    例如:播放一段视频:

       <A HREF="welcome.avi">WINDOWS95</A>  WINDOWS95

    自动载入视频

      与音乐的播放一样,我们可以使用EMBED标签播放视频,

        <EMBED SRC="视频文件地址">

    属性有:

    SRC="FILENAME" 设定文件的路径 AUTOSTART=TRUE/FALSE 是否要文件传送完就自动播放,TRUE是要,FALSE是不要,默认为FALSE LOOP=TRUE/FALSE 设定播放重复次数,LOOP=6表示重复6次,TRUE表示无限次播放,FALSE播放一次即停止。 STARTIME="分:秒" 设定开始播放时间,如20秒后播放写为STARTIME=00:20 VOLUME=0-100 设定音量的大小。如果没设定的话,就用系统的音量。 WIDTH HEIGHT 设定控制面板的大小

    例:
    *************************************

    <html>
    <head>
    <title>播放视频</title>
    </head>

    <body>
    <B><font size=4>播放视频WINDOWS95</font></B>
    <P>
      <EMBED SRC="welcome.avi" autostart=false loop=false width=350 height=250>
    </P>
    </body>
    </html>

    HTML文件之间的链接

    文件之间的链接

      超文本中的链接是其最重要的特性之一,使用者可以从一个页面直接跳转到其他的页面、图象或者服务器。一个链接的基本格式如下:

          <A HREF="资源地址">链接文字</A>

      ·标签<A>表示一个链接的开始,</A>表示链接的结束;
      ·属性“HREF”定义了这个链接所指的地方;
      ·通过点击“链接文字”可以到达指定的文件。

      <A HREF="http://www.sjstc.edu.cn">中国山西之窗</A>

      链接分为本地链接、URL链接和目录链接。在各种链接的各个要素中,资源地址是最重要的,一旦路径上出现差错,该资源就无法从用户端取得。

    本地链接:
    **************

      对同一台机器上的不同文件进行的连接称为本地链接,它使用UNIX或DOS系统中文件路径的表示方法,采用绝对路径或相对路径来指示一个文件。
      例如:我们现在正在浏览的这一页的绝对路径是:c:\study\HTML教程\link01.htm
         而这一页相对于当前目录即“HTML教程”的相对路径是:link01.htm
         如果是浏览HTML教程之外的一页,该文件路径要以两个圆点(..)来表示上一层目录:                    ../../internet/IP地址

      现在我们把这几种路径的表示方法写入链接中:

      以绝对路径表示:<A HREF="/c:\study\HTML教程\link01.htm">文件的链接</A>
      以相对路径表示:<A HREF="link01.htm">文件的链接</A>
      链接上一目录中的文件:<A HREF="../../Internet/IP地址">IP地址</A>

      一般情况下,我们是不用绝对路径的,因为我们的资源常常是放在网上供其他人浏览的,写成绝对路径,当我们把整个目录中的所有文件移植到服务器上时,带有C:\的资源地址用户将无法访问到。所以我们最好写成相对路径,避免了重新修改文件资源路径的麻烦。

    URL链接
    ************

      如果链接的文件在其它服务器上,我们就要弄清我们所指向的文件时采用的哪一种URL地址。URL意思是统一资源定位器,通过它可以以多种通讯协议于外界沟通来存取信息。

      URL链接的形式是:  协议名://主机.域名/路径/文件名
      其中协议包括:

      file      本地系统文件
      http      WWW服务器
      ftp       ftp服务器
      telnet     基于TELNET的协议
      mailto     电子邮件
      news      Usenet新闻组
      gopher     GOPHER服务器
      wais      WAIS服务器

      例如,我们这样来表达一个URL地址:

          http://www.sjstc.edu.cn/
          ftp://ftp.sjstc.edu.cn
          telnet://bbs.xanet.edu.cn

     写在HTML文件中,链接其他主机上的文件时,格式如下:

      <A HREF="http://www.sjstc.edu.cn/default.htm">中国山西之窗</A>
      <A HREF="telnet://bbs.xanet.edu.cn">西北网络中心兵马俑站</A>

    目录链接
    **************

      前面所谈的资源地址,只是单纯的指向一份文件,但是,对于直接指到某文件上部、下部或是中央部分,以上方法却是无法做到的。然而,我们要这样做,也并不是毫无办法。我们可以是使用目录链接。

      制作目录链接方法是:
      ·首先把把某段落设置为链接位置,格式是:〈A NAME="链接位置名称"></A>
      ·在调用此链接部分的文件,定义连接:<A HREF="文件名#链接位置名称">链接文字</A>
       如果是在一个文件内跳转,文件名可以省略不写。

    例:

    <html>
    <head>
    <title>链接举例</title>
    </head>

    <body>
    <font color=blue>

      我们的HTML教程已经进行到“文件之间的链接”部分,其中,我们学习了<A href="link01.htm#n1">本地链接<A>、<A href="link01.htm#n3">目录链接</A>和<A href="link01.htm#n2">URL链接</A>。之前,我们还介绍了<A href="4.htm">文字的设计</A>、<A href="table.htm">TABLE表格</A>、<A href="list01.htm">列表</A>等内容。也许很多人理解起来比较吃力,这是很正常的,每个人在刚刚接触它的时候往往要度过很长的一段接受时期。<P>
      除了我们的这个教程外,网上也有很多的站点介绍了HTML文件的制作方法,在这里,我来推荐几个做得相当不错的站点:<P>

     <A href="http://www.dlc.sjtu.edu.cn/courseware/html_learning/hrefsrcci.htm">HTML语言参考</A><br>
     <A href="http://www.gzsums.edu.cn/webclass/html/html_design.html">HTML语言教程</A><br>
     <A href="http://www.netease.com/~feng/html/index.htm">HTML程序员手册</A><P>

    </body>
    </html>

    HTML页面布局与文字设计

    标题

      一般文章都有标题、副标题、章和节等结构,HTML中也提供了相应的标题标签<Hn>,其中n为标题的等HTML总共提供六个等级的标题,n越小,标题字号就越大,以下列出所有等级的标题:

    〈H1>…</H1>     第一级标题

    〈H2>…</H2>     第二级标题

    〈H3>…</H3>     第三级标题

    〈H4>…</H4>     第四级标题

    〈H5>…</H5>     第五级标题

    〈H6>…</H6>     第六级标题

    请看下面的例子:

    <html>
    <head>
    <title>标题示例</title>
    </head>

    <body>

    这是一行普通文字<P>
    〈H1>一级标题</H1>
    〈H2>二级标题</H2>
    〈H3>三级标题</H3>
    〈H4>四级标题</H4>
    〈H5>五级标题</H5>
    〈H6>六级标题</H6>
    </body>

    </html>

    换行<br>

      在编写HTML文件时,我们不必考虑太细的设置,也不必理会段落过长的部分会被浏览器切掉。因为,在HTML语言规范里,每当浏览器窗口被缩小时,浏览器会自动将右边的文字转折至下一行。所以,编写者对于自己需要断行的地方,应加上<br>标签。

    段落标签<P>

      为了排列的整齐、清晰,文字段落之间,我们常用<P></P>来做标记。文件段落的开始由<P>来标记,段落的结束由</P>来标记,</P>是可以省略的,因为下一个<P>的开始就意味着上一个<P>的结束。

      <P>标签还有一个属性ALING,它用来指名字符显示时的对齐方式,一般值有CENTER、LEFT、RIGHT三种。

      下面,我们用两个例子来说明这个标签的用法。

    <html>
    <head>
    <title>段落标签</title>
    </head>

    <body>
    <P ALIGN=CENTER>
    浣溪沙 <P>一曲新词酒一杯,去年天气旧亭台,夕阳西下几时回。<P>无可奈何花落去,似曾相识燕归来。小园香径几徘徊。</P>
    </body>

    </html>

    水平线段<HR>

      这个标签可以在屏幕上显示一条水平线,用以分割页面中的不同部分。<HR>有三个属性:

       size 水平线的宽度
       width 水平线的长,用占屏幕宽度的百分比或象素值来表示
       align 水平线的对齐方式,有LEFT RIGHT CENTER三种
       noshade 线段无阴影属性,为实心线段

      我们可以用几个例子来说明这线段的用法:

    线段粗细的设定

    <HTML>
    <HEAD>
    <TITLE>线段粗细的设定</TITLE>
    </HEAD>

    <BODY>
    <P>这是第一条线段,无size设定,取内定值SIZE=1来显示<BR>
    <HR>
    <P>这是第二条线段,SIZE=5<BR>
    <HR SIZE=5>
    <P>这是第三条线段,SIZE=10<BR>
    <HR SIZE=10>
    </BODY>

    </HTML>

    线段长度的设定

    <HTML>
    <HEAD>
    <TITLE>线段长度的设定</TITLE>
    </HEAD>

    <BODY>
    <P>这是第一条线段,无WIDTH设定,取WIDTH内定值100%来显示<BR>
    <HR SIZE=3>
    <P>这是第二条线段,WIDTH=50(点数方式)<BR>
    <HR WIDTH=50 SIZE=5>
    <P>这是第三条线段,WIDTH=50%(百分比方式)<BR>
    <HR WIDTH=50% SIZE=7>
    </BODY>

    </HTML>

    线段排列的设定

    <HTML>
    <HEAD>
    <TITLE>线段排列的设定</TITLE>
    </HEAD>

    <BODY>
    <P>这是第一条线段,无ALIGN设定,(取内定值CENTER显示)<BR>
    <HR WIDTH=50% SIZE=5>
    <P>这是第二条线段,向左对齐BR>
    <HR WIDTH=60% SIZE=7 ALIGN=LEFT>
    <P>这是第三条线段,向右对齐<BR>
    <HR WIDTH=70% SIZE=2 ALIGN=RIGHT>
    </BODY>

    </HTML>

    无阴影的设定

    <HTML>
    <HEAD>
    <TITLE>
    无阴影的设定</TITLE>
    </HEAD>

    <BODY>
    <P>这是第一条线段,无NOSHADE设定,取内定值阴影效果来显示<BR>
    <HR WIDTH=80% SIZE=5>
    <P>这是第二条线段,有NOSHADE设定<BR>
    <HR WIDTH=80% SIZE=7 ALIGN=LEFT NOSHADE>
    </BODY>

    </HTML>

    文字的大小设置

      提供设置字号大小的是FONT,FONT有一个属性SIZE,通过指定SIZE属性就能设置字号大小,而SIZE属性的有效值范围为1-7,其中缺省值为3。我们可以SIZE属性值之前加上“+”、“-”字符,来指定相对于字号初始值的增量或减量。

      请看示例:

    <html>
    <head>
    <title>字号大小</title>
    </head>

    <body>
    <font size=7>这是size=7的字体</font><P>
    <font size=6>这是size=6的字体</font><P>
    <font size=5>这是size=5的字体</font><P>
    <font size=4>这是size=4的字体</font><P>
    <font size=3>这是size=3的字体</font><P>
    <font size=2>这是size=2的字体</font><P>
    <font size=1>这是size=1的字体</font><P>
    <font size=-1>这是size=-1的字体</font><P>
    </body>

    </html>

    文字的字体与样式

      HTML4.0提供了定义字体的功能,用FACE属性来完成这个工作。FACE的属性值可以是本机上的任一字体类型,但有一点麻烦的是,只有对方的电脑中装有相同的字体才可以在他的浏览器中出现你预先设计的风格。

      <font face="字体">

    请看例子:

    <HTML>
    <HEAD>
    <TITLE>字体</TITLE>
    </HEAD>

    <BODY>
    <CENTER>
    <FONT face="楷体_GB2312">欢迎光临</FONT><P>
    <FONT face="宋体">欢迎光临</FONT><P>
    <FONT face="仿宋_GB2312">欢迎光临</FONT><P>
    <FONT face="黑体">欢迎光临</FONT><P>
    <FONT face="Arial">Welcom my homepage.</FONT><P>
    <FONT face="Comic Sans MS">Welcom my homepage.</FONT><P>
    </CENTER>
    </BODY>

    </HTML>

    为了让文字富有变化,或者为了着意强调某一部分,HTML提供了一些标签产生这些效果,现将常用的标签列举如下:

    <B>     </B>     粗体              HTML语言

    <I>     </I>     斜体              HTML语言

    <U>     </U>     加下划线            HTML语言

    <TT>     <TT>     打字机字体           HTML语言

    <BIG>    </BIG>    大型字体            HTML语言

    <SMALL>   </SMALL>   小型字体            HTML语言

    <BLINK>   </BLINK>   闪烁效果            HTML语言

    <EM>     </EM>     表示强调,一般为斜体      HTML语言

    <STRONG>   </STRONG>   表示特别强调,一般为粗体    HTML语言

    <CITE>    </CITE>    用于引证、举例,一般为斜体   HTML语言

    现在我们用一个实例来看看效果:

    <html>
    <head>
    <title>字体样式</title>
    </head>

    <body>
    <B>黑体字</B>
    <P> <I>斜体字</I>
    <P> <U>加下划线</U>
    <P> <BIG>大型字体</BIG>
    <P> <SMALL>小型字体</SMALL>
    <P> <BLINK>闪烁效果</BLINK>
    <P><EM>Welcome</EM>
    <P><STRONG>Welcome</STRONG>
    <P><CITE>Welcom</CITE></P>
    </body>

    </html>

    文字的颜色

      文字颜色设置格式如下:

       <font color=color_value>…</font>

      这里的颜色值可以是一个十六进制数(用“#”作为前缀),也可以是以下16种颜色名称。

    Black = "#000000" Green = "#008000" Silver = "#C0C0C0" Lime = "#00FF00" Gray = "#808080" Olive = "#808000" White = "#FFFFFF" Yellow = "#FFFF00" Maroon = "#800000" Navy = "#000080" Red = "#FF0000" Blue = "#0000FF" Purple = "#800080" Teal = "#008080" Fuchsia = "#FF00FF" Aqua = "#00FFFF"

    请看例子:

    <HTML>
    <HEAD>
    <TITLE>文字的颜色</TITLE>
    </HEAD>

    <BODY BGCOLOR=000080>
    <CENTER>
    <FONT COLOR=WHITE>色彩斑斓的世界</FONT><BR>
    <FONT COLOR=RED>色彩斑斓的世界</FONT> <BR>
    <FONT COLOR=#00FFFF>色彩斑斓的世界</FONT><BR>
    <FONT COLOR=#FFFF00>色彩斑斓的世界</FONT><BR>
    <FONT COLOR=#FFFFFF>色彩斑斓的世界</FONT> <BR>
    <FONT COLOR=#00FF00>色彩斑斓的世界</FONT><BR>
    <FONT COLOR=#C0C0C0>色彩斑斓的世界</FONT><BR>
    </CENTER>
    </BODY>

    </HTML>

    位置控制

      通过ALIGN属性可以选择文字或图片的对齐方式,LEFT表示向左对齐,RIGHT表示向右对齐,CENTER表示居中。基本语法如下:

         <DIV ALIGN=#>   #=left/right/center

    例:

    <html>
    <head>
    <title>位置控制</title>
    </head>

    <body>
    <div align=left>
    你好!<br>
    <div align=right>
    你好!<br>
    <div align=center>
    你好!<br>
    </body>

    </html>

    另外,ALIGN属性也常常用在其它标签中,引起其内容位置的变动。

      如:<P ALIGN=#>
        <HR ALIGN=#>   #=left/right/center
        <H1 ALIGN=#〉

    综合示例

      前面我们所讲是单独使用一个标签的方法,在实际的编写中,许多标签和一些属性是结合起来使用的,
    比如:
        <FONT COLOR="#" SIZE=#>文字</FONT>
        <B><U>文字</U></B>

    【例】

    <HTML>
    <HEAD>
    <TITLE>字体样式</TITLE>
    </HEAD>

    <BODY>
    <P>
    <B><U><FONT COLOR="#A35252"><FONT SIZE=+1>白居 易</FONT></FONT></U></B>
    </P>

    <P>  白居易(772-846年)字乐天,晚居香山,自号香山居士,原籍太原。白居易是唐代新乐府运动的倡<BR> 导者,是中国文学史上堪与屈原、李白、杜甫并列的第一流大诗人。 </P>

    <P>  白居易出身于小官僚家庭。大约在贞元三年( 787年)的年初,十六岁的白居易带着自己的诗稿,到<BR> 了京都长安。老诗人顾况看到这位不速之客的姓名有“居易”二字,便很恢谐地说:“长安米贵,居住不易!”及披卷读到《赋得古原草送别》中的</P>

    <P ALIGN=center><FONT COLOR="#3C7777"><CITE>“离离原上草,一岁一枯荣;野火烧不尽,春风吹又生”</CITE></FONT></P>

    <P>时, 不禁大为惊奇,拍案称绝,马上改变语气,郑重地说:“能写出这样好的诗句,‘居’下去是不难的,刚才我是同你开开玩笑罢了。”从此,白居易的诗名大振。 </P>

    <P>  白居易生活的时代,主要是建中、元和、长庆时期(公元781-824年)。是唐朝走向衰败的极端苦难动荡的时代。 </P>

    <P>  白居易是继杜甫之后,我国伟大的现实主义诗人。 他的贡献是在总结我国自《诗经》以来现实主义诗歌创作经验的基础上,建立了现实主义的诗歌理论,掀起了一个波澜壮阔的现实主义的诗歌运动——新乐府运动,创作了大量优秀的现实主义诗篇。 </P>

    </BODY>
    </HTML>

    HTML的基本结构

    超文本文档分文档头和文档体两部分,在文档头里,对这个文档进行了一些必要的定义,文档体中才是要显示的各种文档信息。

    <HTML>

       <HEAD>
          头 部 信 息
       </HEAD>

       <BODY>
         文 档 主 体, 正 文 部 分
       </BODY>

    </HTML>

       其中<HTML>在最外层, 表示这对标记间的内容是HTML文 档。我们还会看到一些Hompage省略<HTML>标记,因为.html 或.htm 文件被Web浏览器默认为是HTML文档。<HEAD> 之间包括文档的头部信息,如文档总标题等,若不需头部信息则可省略此标记。<BODY> 标记一般不省略, 表示正文内容的开始。

    下面是一个最基本的超文本文档的源代码:

    <HTML>
    <HEAD>
    <TITLE>一个简单的HTML示例</TITLE>
    </HEAD>

    <BODY>
    <CENTER>
    <H3>欢迎光临我的主页</H3>
    <BR>
    <HR>
    <FONT SIZE=2>
      这是我第一次做主页,无论怎么样,我都会努力做好!
    </FONT>
    </CENTER>
    </BODY>

    </HTML>

    超文本中的标签

      刚刚接触超文本,遇到的最大的障碍就是一些用“<”和“>”括起来的句子,我们称它为标签,是用来分割和标记文本的元素,以形成文本的布局、文字的格式及五彩缤纷的画面。

    1. 单标签

      某些标记称为“单标签”,因为它只需单独使用就能完整地表达意思,这类标记的语法是:

              < 标签名称>

       最常用的单标签是<BR>, 它表示换行。

    2.双标签

      另一类标记称为“双标签”,它由“始标签”和“尾标签”两部分构成,必须成对使用,其中始标签告诉Web浏览器从此处开始执行该标记所表示的功能,而尾标签告诉Web浏览器在这里结束该功能。始标签前加一个斜杠(/)即成为尾标记。这类标记的语法是:

                 <标签> 内 容</ 标签>

      其中“内容” 部分就是要被这对标记施加作用的部分。例如你想突出对某段文字的显示,就将此段文字放在一<EM> </EM>标记中:

                  <EM>第一:</EM>

    3.标签属性

      许多单标记和双标记的始标记内可以包含一些属性, 其语法是:

            < 标签名字 属性1 属性2 属性3 … >

      各属性之间无先后次序,属性也可省略(即取默认值),例如单标记<HR>表示在文档当前位置画一条
    水平线(horizontal line),一般是从窗口中当前行的最左端一直画到最右端。带一些属性:

    <HR SIZE=3 ALIGN=LEFT WIDTH="75%">   其中SIZE属性定义线的粗细,属性值取整数,缺为1;ALIGN属性表示对齐方式,可取LEFT(左对齐, 缺省值),CENTER(居中),RIGHT(右对齐);WIDTH 属性定义线的长度,可取相对值,(由一对 " " 号括起来的百分数,表示相对于充满整个窗口的百分比),也可取绝对值(用整数表示的屏幕像素点的 个数,如WIDTH=300),缺省值是"100%"。

    HTML入门

    HTML英语意思是:Hypertext Marked Language,即超文本标记语言,是一种用来制作超文本文档的简单标记语言。用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台(如UNIX,WINDOWS等)。自1990年以来HTML就一直被用作World Wide Web 的信息表示语言,用于描述Homepage的格式设计和它与WWW上其它Homepage 的连结信息。使用HTML语言描述的文件,需要通过WWW浏览器显示出效果。

      所谓超文本,因为它可以加入图片、声音、动画、影视等内容,因为它可以从一个文件跳转到另一个文件,与世界各地主机的文件连接。

      通过HTML可以表现出丰富多彩的设计风格

         图片调用:<IMG SRC="文件名">
         文字格式:<FONT SIZE="+5 " COLOR="00FFFF">文字</FONT>

      通过HTML可以实现页面之间的跳转

         页面跳转:〈A HREF="文件路径/文件名"></A>

      通过HTML可以展现多媒体的效果

         声频:<EMBED SRC="音乐文件名" AUTOSTART=true>
         视频:<EMBED SRC="视频文件名" AUTOSTART=true>

      上面我们在示例超文本特征的同时,采用了了一些我们在制作超文本文件时需要用到的一些标签。所谓标签,就是它采用了一系列的指令符号来控制输出的效果,这些指令符号用“<标签名字 属性>”来表示。

    为日志添加背景图片

    首先进入正常日志编辑模式,键入你所需的日志内容,并视个人需要进行排版编辑。进入HTML语法编辑模式,
    将下列语法粘贴至你的编辑页面内顶端:

     

    <IMG src="背景图片链接地址" width=图片宽度值 height=图片高度值 align=right style="FILTER: alpha(opacity=100, finishOpacity=0,style=2) ">
    <DIV style="FILTER: alpha(opacity=45, finishOpacity=45,style=0); FLOAT: left; WIDTH: 文本宽度值">
    <DIV style="LINE-HEIGHT: 行间距值(pt); LETTER-SPACING: 字符间距值(em)">
    <P><FONT color=#ffffff size=2>你的日志文字</FONT></P>
    </DIV></DIV>

     

    再将你刚刚编辑好的文字内容(注意,除了文字内容可能还会包含你进行格式编排后的若干语法语句)剪切并粘贴到上面语法中的“你的日志文字”的位置。

     


    下面简要介绍一下上面语法中的两行主要命令语句的含义:

     


    <IMG src=…….>控制日志中的背景图片,图片的宽度及高度值均以px为单位;align这一参数控制图片位置,但不要对此进行更改,否则无法实现文字浮于图片之上的效果。Filter控制背景图片的柔化滤镜,大家可以修改其中的数值已达到不同的效果,但注意style的值只能取1,2,3这三个数值。除了柔化效果外,还有翻转、发光、阴影等若干特效,但语法表述各有不同,在此不再赘述,有兴趣的朋友可以在互联网上查询相关语法。在Space空间不同的布局方式下,日志宽度是不相同的,所以为了更好的配合日志的页面效果,建议选择合适宽度的图片,具体可根据布局的实际情况(即日志的宽窄程度)将图片宽度分别设定在260px、350px、370px、550px、730px左右的近似值。

     


    <DIV style="FILTER…….>控制日志文字的若干效果,其中Filter命令的使用方法与前述一致,也是调节柔化效果。文本宽度也采取px为单位,其最大值也要参照上面不同布局方式时所要求的近似宽度值,如果你希望文字完全分布在整个日志页面上,那么将WIDTH值设为100%即可。在设定了具体宽度的情况下Float命令可以省略,否则请予以保留。

     


    有一个问题需要注意,预览中文字相对于背景图片的位置往往与最终显示在日志中的位置不一样,这还需要你返回到该日志进行进一步的修改,这确实需要一些耐心,但相信经过一段时间的实际应用,你会总结出一些经验技巧的。

     

    另外还有一个语法比较简单,适合做一些简单的背景图片和文字

    <div style="width: 150; height: 205" align=right>
    <IMG src="背景图片链接地址" align=right>
    <div style="float: right" align=center>
    <p align="center"><font face="Times New Roman">你的日志文字</font>
    </div>

     

     

    现在建议用<table>语法添加背景图片,语法简单实用。点击进入

     

    扩展日志右边的叶面

    </td></table>

    使用方法:

    1.将页面版式修改为左宽右窄,将日志模块放在左边,列表或播放器放在右边

    2.添加HTML模块位于日志模块之上,在HTML模块中添加以上代码,保存

    淡水鱼`。`