網(wǎng)頁的動態(tài)、多媒體效果_第1頁
網(wǎng)頁的動態(tài)、多媒體效果_第2頁
網(wǎng)頁的動態(tài)、多媒體效果_第3頁
網(wǎng)頁的動態(tài)、多媒體效果_第4頁
網(wǎng)頁的動態(tài)、多媒體效果_第5頁
已閱讀5頁,還剩5頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

1.8網(wǎng)頁的動態(tài)、多媒體效果在網(wǎng)頁的設(shè)計(jì)過程中,動態(tài)效果的插入,會使網(wǎng)頁更加生動靈活、豐富多彩。一、滾動字幕<marquee><marquee>標(biāo)簽可以實(shí)現(xiàn)元素在網(wǎng)頁中移動的效果,以達(dá)到動感十足的視覺效果。<marquee>標(biāo)簽是一個成對的標(biāo)簽。應(yīng)用格式為:<marqueebehavior=>...</marquee><marquee>標(biāo)簽有很多屬性,用來定義元素的移動方式:屬性描述align指定對齊方式top,middle,bottomscroll單向運(yùn)動slide如幻燈片,一格格的,效果是文字一接觸左邊就停止。alternate左右往返運(yùn)動bgcolor設(shè)定文字卷動范圍的背景顏色loop設(shè)定文字卷動次數(shù),其值可以是正整數(shù)或infinite表示無限次默認(rèn)為無限循環(huán)height設(shè)定字幕高度width設(shè)定字幕寬度scrollamount指定每次移動的速度,數(shù)值越大速度越快scrolldelay文字每一次滾動的停頓時(shí)間,單位是毫秒。時(shí)間越短滾動越快hspace指定字幕左右空白區(qū)域的大小vspace指定字幕上下空白區(qū)域的大小direction設(shè)定文字的卷動方向,left表示向左,right表示向右,up表示往上滾動behavior指定移動方式,scroll表示滾動播出,slibe表示滾動到一方后停止,alternate表示滾動到一方后向相反方向滾動。8-1實(shí)例a.html<html><body><center><fontface="字體2"size=6color="#ff0000">滾動字幕</font><br><marquee>啦啦啦~~~我會跑了</marquee><p><marqueeheight="200"direction="up"hspace="200">啦啦啦~~~我會往上跑了<br>啦啦啦~~~我會往上跑了</marquee><p><marqueedirection="right">啦啦啦~~~我會往右跑了</marquee><p><marqueeheight="200"direction="down"><center>啦啦啦~~~我會往下跑了</center></marquee><p><marqueewidth="500"behavior="alternate">啦啦啦~~~我來回的跑</marquee><p><marqueebehavior="slide">啦啦啦~~~我跑到目的地就該休息了</marquee><P><marqueescrollamount="2">啦啦啦~~~我累了,要慢慢的溜達(dá)</marquee><P><marqueescrolldelay="300">啦啦啦~~~我累了,我要走走停停</marquee><p><marqueescrollamount="20">哈哈~都沒有我跑得快</marquee><p><marquee><imgsrc="../../imge/6-2.jpg">啦啦啦~~圖片也可以啊</marquee><p><marqueebgcolor="#FFFFCC"width="700"vspace="30"><fontsize="+3"color="#FF0000">啦啦啦~~滾動文字有背景了</font></marquee></center></body></html>二、插入多媒體文件在網(wǎng)頁中可以用<embed>標(biāo)簽將多媒體文件插入,比如可以插入音樂和視頻等。用瀏覽器可以播放的音樂格式有:MIDI音樂、WAV音樂、mp3、AIFF、AU格式等。<embed>標(biāo)簽的使用格式:<EMBEDSRC="音樂文件地址">SRC="FILENAME"設(shè)定音樂文件的路徑AUTOSTART=TRUE/FALSE是否要音樂文件傳送完就自動播放,TRUE是要,F(xiàn)ALSE是不要,默認(rèn)為FALSE可以非常方便的完成導(dǎo)航工作。而所有的框架標(biāo)記要放在一個html文檔中。html頁面的文檔體標(biāo)簽<body>被框架集標(biāo)簽<frameset>所取代,然后通過<frameset>的子窗口標(biāo)簽<frame>定義每一個子窗口和子窗口的頁面屬性。語法格式:<html><head></head><frameset><framesrc="url地址1"><framesrc="url地址2">......</frameset></html>Frame子框架的src屬性的每個URL值指定了一個html文件(這個文件必須事先做好)地址,地址路徑可使用絕對路徑或相對路徑,這個文件將載入相應(yīng)的窗口中??蚣芙Y(jié)構(gòu)可以根據(jù)框架集標(biāo)簽<frameset>的分割屬性分為3種:左右分割窗口、上下分割窗口、嵌套分割窗口二、框架集<frameset>控制屬性描述border設(shè)置邊框粗細(xì),默認(rèn)是5象素.bordercolor設(shè)置邊框顏色frameborder指定是否顯示邊框:"0"代表不顯示邊框,"1"代表顯示邊框cols用"400"和"20%"分割左右窗口,"*"表示剩余部分rows用"象素?cái)?shù)"和"%"分割上下窗口,"*"表示剩余部分framespacing="5"表示框架與框架間的保留空白的距離noresize設(shè)定框架不能夠調(diào)節(jié),只要設(shè)定了前面的,后面的將繼承左右分割窗口屬性:cols如果想要在水平方向?qū)g覽器分割多個窗口,這需要使用到框架集的左右分割窗口屬性cols.分割幾個窗口其cols的值就有幾個,值的定義為寬度,可以是數(shù)字(單位為像素),也可以是百分比和剩余值。各值之間用逗號分開。其中剩余值用"*"號表示,剩余值表示所有窗口設(shè)定之后的剩余部分,當(dāng)"*"只出現(xiàn)一次時(shí),表示該子窗口的大小將根據(jù)瀏覽器窗口的大小自動調(diào)整,當(dāng)"*"出現(xiàn)一次以上時(shí),表示按比例分割剩余的窗口空間。cols的默認(rèn)值為一個窗口如:<framesetcols="40%,2*,*">將窗口分為40%,40%,20%<framesetcols="100,200,*"><framesetcols="100,*,*">將100像素以外的窗口平均分配<framesetcols="*,*,*">將窗口分為三等份2.上下分割窗口屬性:rows上下分割窗口的屬性設(shè)置和左右窗口的屬性設(shè)定是一樣的,參照上面所述就可以了。三、子窗口<frame>標(biāo)簽的設(shè)定<frame>是個單標(biāo)簽,<frame>標(biāo)簽要放在框架集frameset中,<frameset>設(shè)置了幾個子窗口就必須對應(yīng)幾個<frame>標(biāo)簽,而且每一個<frame>標(biāo)簽內(nèi)還必須設(shè)定一個網(wǎng)頁文件(src="*.html",其常用屬性有:屬性描述src指示加載的url文件的地址bordercolor設(shè)置邊框顏色frameborder指示是否要邊框,1顯示邊框,0不顯示(不提倡用yes或no)border設(shè)置邊框粗細(xì)name指示框架名稱,是連結(jié)標(biāo)記的target所要的參數(shù)noresize指示不能調(diào)整窗口的大小,省略此項(xiàng)時(shí)就可調(diào)整,scorlling指示是否要滾動條,auto根據(jù)需要自動出現(xiàn),Yes有,No無marginwidth設(shè)置內(nèi)容與窗口左右邊緣的距離,默認(rèn)為1marginheight設(shè)置內(nèi)容與窗口上下邊緣的邊距,默認(rèn)為1width框窗的寬及高默認(rèn)為width="100"height="100"align可選值為left,right,top,middle,bottom子窗口的排列遵循從左到右,從上到下的次序規(guī)則。1、窗口的左右設(shè)定:實(shí)例一a.html首先我們新建一個文件夾,然后做四個要放到子窗口中的頁面,sl1.html、sl2.html、sl3.html、sl4.html。<html><head></head><framesetcols="20%,2*,*"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl1.html"><framesrc="sl2.html"><framesrc="sl3.html"></frameset><noframes></noframes></html>2、窗口的上下設(shè)定實(shí)例二b.html<html><head></head><framesetrows="20%,*,200"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl1.html"><framesrc="sl2.html"><framesrc="sl3.html"noresize="noresize"></frameset><noframes></noframes></html>3、窗口的嵌套設(shè)定實(shí)例三sl9-3.html<html><head></head><framesetcols="20%,*"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl1.html"><framesetrows="300,500"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl2.html"><framesrc="sl3.html"></frameset></frameset><noframes></noframes></html>實(shí)例四e.html<html><head></head><framesetrows="20%,*"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl1.html"><framesetcols="20%,*"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl2.html"><framesrc="sl3.html"></frameset></frameset><noframes></noframes></html>實(shí)例五sl9-5.html<html><head></head><framesetrows="20%,*,15%"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl1.html"><framesetcols="20%,*"framespacing="1"frameborder="yes"border="1"bordercolor="#FF00FF"><framesrc="sl2.html"><framesrc="sl3.html"></frameset><framesrc="sl4.html"></frameset><noframes></noframes></html>四、浮動窗口<iframe><iframe>這標(biāo)記只適用於IE瀏覽器。它的作用是在瀏覽器窗口中可以嵌入一個框窗以顯示另一個文件。它是一個圍堵標(biāo)記,但圍著的字句只有在瀏覽器不支援iframe標(biāo)記時(shí)才會顯示,如<noframes>一樣,可以放些提醒字句之類。通常iframe配合一個辨認(rèn)瀏覽器的JavaScript會較好,若JavaScript認(rèn)出該瀏覽器并非InternetExplorer便會切換至另一版本。<iframe>的參數(shù)設(shè)定格式:<iframesrc="iframe.html"name="test"align="MIDDLE"width="300"height="100"marginwidth="1"marginheight="1"frameborder="1"scrolling="Yes">性含義src浮動窗框中的要顯示的頁面文件的路徑,可以是相對或絕對。name此框窗名稱,這是連結(jié)標(biāo)記的target參數(shù)所要的,align可選值為left,right,top,middle,bottom,作用不大height框窗的高,以pixels為單位。width框窗的寬,以pixels為單位。marginwidth該插入的文件與框邊所保留的空間。marginheight該插入的文件與框邊所保留的空間。frameborder使用1表示顯示邊框,0則不顯示。(可以是yes或no)scrolling使用Yes表示容許卷動(內(nèi)定),No則不容許卷動。實(shí)例f.html<html><head><title>浮動框架</title></head><bodybgcolor="#E1FFE1"><center><iframesrc="ml1.html"name="aa"width="600"height="400"marginwidth="30"marginheight="20"align="middle"allowtransparency="true">這是一個浮動窗口</iframe><p><ahref="sl1.html"target="aa">愛在深秋</a></p><p><ahref="sl2.html"target="aa">圖像對文字的水平居中</a></p><p><ahref="sl3.html"target="aa">圖像與文本之間的距離</a></p><p><ahref="sl4.html"target="aa">圖像大小的設(shè)定</a></p><p><ahref=""target="aa3">新浪網(wǎng)站</a></p></center></body

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論