技術文章 » html網頁特效程式碼有哪些

html網頁特效程式碼有哪些

2021-03-16 16:00:52

html網頁特效程式碼有：1、字型加粗【<b>xx</b>】；2、字型斜體【<i>xx</i>】；3、字型控制大小【<h1>xx</h1>】；4、換貼文背景【<body background="xx">】；5、貼圖【<img src=「」】。

本教學操作環境：windows7系統、html5版，DELL G3電腦。

html網頁特效程式碼有：

1)貼圖：

<img src="圖片地址">

2)加入連線：

<a href="所要連線的相關地址">寫上你想寫的字</a>

3)在新視窗開啟連線：

<a href="相關地址" target="_blank">寫上要寫的字</a>

消除連線的下劃線在新視窗開啟連線：

<a href="相關地址" style="text-decoration:none" target="_blank">寫上你想寫的字</a>

4)移動字型(走馬燈)：

<marquee>寫上你想寫的字</marquee>

5)字型加粗：

<b>寫上你想寫的字</b>

6)字型斜體：

<i>寫上你想寫的字</i>

7)字型下劃線:

<u>寫上你想寫的字</u>

8)字型刪除線:

<s>寫上你想寫的字</s>

9)字型加大:

<big>寫上你想寫的字</big>

10)字型控制大小：

<h1>寫上你想寫的字</h1>

(其中字型大小可從h1-h5,h1最大，h5最小)

11)更改字型顏色：

<font color="#value">寫上你想寫的字</font>

(其中value值在000000與ffffff(16位元進位制)之間

12)消除連線的下劃線：

<a href="相關地址" style="text-decoration:none">寫上你想寫的字</a>

13)貼音樂：

<embed src=音樂地址 width=300 height=45 type=audio/mpeg autostart="false">

14)貼flash:

<embed src="flash地址" width="寬度" height="高度">

15)貼影視檔案：

<img dynsrc="檔案地址" width="寬度" height="高度" start=mouseover>

16)換行：<br>

17)段落：

<p>段落</p>

18)原始文字樣式：

<pre>正文</pre>

19)換貼文背景：

<body background="背景圖片地址">

20)固定貼文背景不隨卷軸捲動：

<body background="背景圖片地址" body bgproperties=fixed>

21)客製化貼文背景顏色：<body bgcolor="#value">(value值見10)

22)貼文背景音樂：<bgsound="背景音樂地址" loop=infinite>

23)貼網頁：<iframe src="相關地址" width="寬度" height="高度"></iframe>

HTML特效程式碼1。忽視右鍵 

　 <body oncontextmenu="return false">

　 或 

 <body style="overflow-y:hidden">

2.加入背景音樂 

　 IE:<bgsound src="*.mid" loop=infinite> 
　 NS:<embed src="*.mid" autostart=true hidden=true loop=true> 
　 </embed> 
　 *.mid你的背景音樂的midi格式檔案

3. 簡單的window.open方法 

　 <a href="#" 
　 onclick="javascript :window.open(檔案路徑/檔名,newwindow, 
　 toolbar=no,scrollbars=yes,resizable=no,top=0,left=0, 
　 width=400,height=300);">文字或圖片</a>

　 引數解釋：

  • 　 <SCRIPT LANGUAGE="javascript"> js指令碼開始；

  • 　 window.open 彈出新視窗的命令；

  • 　 檔案路徑/檔名 彈出視窗的檔名；

  • 　 newwindow 彈出視窗的名字（不是檔名），非必須，可用空代替；

  • 　 width=400 視窗寬度；

  • 　 height=300 視窗高度；

  • 　 top=0 視窗距離螢幕上方的象素值；

  • 　 left=0 視窗距離螢幕左側的象素值；

  • 　 toolbar=no 是否顯示工具列，yes為顯示；

  • 　 menubar，scrollbars 表示選單欄和卷軸。

  • 　 resizable=no 是否允許改變視窗大小，yes為允許；

  • 　 location=no 是否顯示位址列，yes為允許；

  • 　 status=no 是否顯示狀態列內的資訊（通常是檔案已經開啟），yes為允許；

  • 　 </SCRIPT> js指令碼結束

4. 簡單的頁面加密 

　 <script LANGUAGE="javascript"> 
　 <!-- 
　 function loopy(){ 
　　 var sWord =""; 
　　 while(sWord!="login"){sWord=prompt("請輸入你的登陸密碼");} 
　　 alert("登陸成功！"); 
　 } 
　 loopy() 
　 //--> 
　 </script>

5. 拉動頁面時背景圖不動 

　 <style> 
　 body{background-image:url(logo.gif); 
　 background-repeat:no-repeat;background-position:center} 
　 </style>

6. 讓瀏覽器在儲存頁面時儲存失敗 

　 <NOSCRIPT><iframe src="*.html"></iframe></NOSCRIPT>

7. 隨機替換圖片 

　 <script> 
　 document.write(<img src="img/+parseInt(Math.random()*(5)) 
　 +.gif"height="40" width="50"> 
　 </script>

　 圖片檔名為0.gif 1.gif 2.gif 3.gif 4.gif

8. 視窗定時關閉

　 先將如下程式碼網頁檔案的區： 

　 <script language="javascript"> 
　 function closeit() { setTimeout("self.close()",10000) //毫秒 } 
　 </script>

　 然後再在<body>標內加入如：<body onload="closeit()">

9. 網頁自動關閉 

　 <html> 
　 <head> 
　 <object id=closes type="application/x-oleobject" 
　 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"> 
　 <param name="Command" value="Close"> 
　 </object> 
　 </head> 
　 <body onload="window.setTimeout(closes.Click(),10000)"> 
　 這個視窗會在10秒過後自動關閉,而且不會出現提示. 
　 </body> 
　 </html>

10. 網頁自動重新整理

　 在head部記入 

　 <META HTTP-EQUIV="Refresh" content="20">

　 其中20為20秒後自動重新整理，你可以更改為任意值。

11. 網頁自動轉頁 

　 <META HTTP-EQUIV="Refresh" CONTENT="時間(秒);URL=地址">

12. 保持layer在最前面，而不被Iframe、Object所覆蓋

　 在Layer中再插Iframe 或 Object 設z-Index值 

　 <div z-Index:2><object xxx></object> ＃ 前面 
　 <div z-Index:1><object xxx></object> ＃ 後面 
　 <div id="Layer2" style="position:absolute; top:40;width:400px; 
　 height:95px;z-index:2"> height=100% width=100%> 
　 <iframe width=0 height=0></iframe> 
　 </div> 
　 <div id="Layer1" style="position:absolute; top:50;width:200px; 
　 height:115px;z-index:1"> 
　 <iframe height=100% width=100%></iframe> 
　 </div>

13.返回上一頁 

 <a href=javascript :history.back(1)>『返回上一頁』</a>

14.關閉視窗 

　 <a href=javascript :self.close()>『關閉視窗』</a>

15.關於iframe的透明背景 

　 <IFRAME ID="iFrame1" SRC="iframe.htm" 
　 allowTransparency="true" 
　 style="</IFRAME>

16. oncontextmenu="window.event.returnValue=false" 將徹底遮蔽滑鼠右鍵 

    <table border oncontextmenu=return(false)><td>no</table>

可用於Table

17.

<body onselectstart="return false">

取消選取、防止複製

18.

onpaste="return false"

不準貼上

19.

oncopy="return false;" oncut="return false;"

防止複製

相關學習推薦：

以上就是html網頁特效程式碼有哪些的詳細內容，更多請關注TW511.COM其它相關文章！