close
HTML iframe 框架語法
HTML iframe 用來設定嵌入框架的應用,首先解釋一下什麼是 HTML 框架,簡單來說,框架可以想像為一個櫥窗,裡面可以放很多的東西,這個櫥窗就像是一個網頁的主體,裡面放的東西可稱為內置框架,這個概念應該蠻容易了解的,那假設我們現在要在一個沒有框架的網頁內某個區塊,採用框架的方式嵌入其他網頁的內容,這時候就可以使用 HTML iframe 來處理,常常見到的如部落格邊欄上用 iframe 嵌入許多外掛,或者是網站上用 iframe 嵌入 Facebook 的粉絲團,都是相當普遍的 HTML iframe 應用方式。

HTML iframe 語法
<iframe src="嵌入目標" width="寬度" height="高度" frameborder="邊框參數" scrolling="卷軸參數"></iframe>
HTML 的 iframe 有許多參數可以設定,最重要的就是 src 這個部分,嵌入目標就是要嵌入的網頁,少了這個部分,iframe 就等於沒有存在意義,嵌入的網頁可以是相同網域內的其他頁面,也可以是外部網頁。width 與 height 分別用來設定 iframe 所要占用的寬度與高度。第三個參數 frameborder 可以用來設定 iframe 的邊框是否要顯示,如果寫為 frameborder="0" 代表不顯示邊框,如果寫成 frameborder="1" 則代表要顯示邊框。最後 scrolling 用來控制 iframe 的卷軸是否要顯示,有三種屬性質可以設定,寫成 scrolling="yes" 代表要顯示捲軸、寫成 scrolling="no" 代表不顯示捲軸、寫成 scrolling="auto" 則代表根據網頁大小自動顯示。

HTML iframe 範例
<iframe src="嵌入目標" width="250px" height="300px" frameborder="0" scrolling="no"></iframe>
此範例的寬度與高度設定都是以 px 為單位,這也是大部分瀏覽器(browser)的預設值,px 有沒有寫通常沒有影響(建議還是寫出來比較不容易出錯),但如果採用百分比做為單位,就一定要寫出來,否則光寫數字會造成瀏覽器的誤判,以為是要以 px 為單位,再來「frameborder="0"」代表不顯示邊框、「scrolling="no"」代表不顯示卷軸,基本上 HTML iframe 的概念就這麼簡單。
來自 http://www.webtech.tw/info.php?tid=99
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
網頁跑馬燈語法製作 marquee 語法教學
網頁跑馬燈是常見的一種表示方法,你可以透過簡單的語法製作符合網頁風格的跑馬燈,同時除了文字型跑馬燈之外,還可以設計成連結式或圖片式跑馬燈。只要透過簡單的 HTML marquee 標籤就可以做到,再透過屬性參數的設定可以達到各種效果唷!

marquee 語法使用方法很簡單,由 marquee 開頭,要跑的文字或圖片放中間,再由 marquee 結尾即可



透過屬性參數設定跑馬燈的跑法,將跑馬燈做成由上往下、由下往上、由左至右或由右至左等效果;除此之外還可以加入跑馬燈的背景顏色、行為模式、對齊方式、設定速度、高度等等項目,調整成適合網頁的風格。

跑馬燈屬性參數
  • 方向設定:direction="參數值";參數值有 up(向上)、dun(向下)、left(向左)、right(向右)。
  • 對齊設定:align="參數值";參數值有 top(向上對齊)、midden(垂直至中)、botton(項下對齊)。
  • 速度設定:scrollamount="參數值" ;參數值為數字,通常設定 1~10 的範圍,數字越大跑得越快。
  • 長度設定:height="參數值";參數為數字,自行設定。
  • 寬度設定:width="參數值";參數為數字,自行設定。
  • 行為設定:behavior="參數值";參數有 alternate(來回跑)、slide(跑入後停止)。
  • 背景顏色:bgcolor="參數值";參數可設定為顏色的色碼,不設定則沒有顏色。
為跑馬燈加上文字連結與圖片



你可以搭配著參數設定,讓連結或圖片也可以照著設定動作。

滑鼠移入後自動停止的方法

這是非常普遍的用法,尤其是當你的跑馬燈有超連結或圖片連結,可以讓網友點選的時候,一定要讓網友的滑鼠移入後自動停止才對,像是促銷優惠或廣告 banner 等都是常見的手法語法如下。



這個語法比較特別,用到了類似 Javascript 的語法,onMouseOver 的意思是滑鼠滑過的時候,onMouseOut 的意思是當滑鼠移走的時候,所以整句的語法就是當滑鼠移入,跑馬燈就停止,當滑鼠移走的時候,則繼續跑。

基本的語法學會後,還可以做到更多的變化唷!例如透過兩個 marquee 標籤包在一起,做出上下左右飄動的跑馬燈特效。或是透過多個跑馬燈跑不同的方向,再設定字體顏色與大小,就可以看到很多個跳動的文字囉!有趣的特效很多,自由發揮吧!
arrow
arrow
    全站熱搜

    rorococo007 發表在 痞客邦 留言(0) 人氣()