html特效代码大全精美
HTML特效文字代码大全
HTML特效⽂字代码⼤全HTML特效⽂字代码⼤全⼀、从右向左移代码<marquee direction=left>需要移动的⽂字</marquee>⼆、从左向右移代码<marquee direction=right>需要移动的⽂字</marquee>三、⼀圈⼀圈绕着移动代码<marquee behavior=scroll>需要移动的⽂字</marquee>四、只移动三次就停了代码<marquee loop=3 behavior=slide>需要移动的⽂字</marquee>五、移⼀步,停⼀停代码<marquee scrolldelay=500scroll amount=100>需要移动的⽂字</marquee>六、左右来回移动代码<marquee behavior=alternate>需要移动的⽂字</marquee>七、忽隐忽现移动代码<marquee behavior="alternate"><marqueewidth="150"direction=right>需要移动的⽂字</marquee>⼋、从下向上移动代码<marquee direction=up><div align="center">需要移动的⽂字</div></marquee>例⼦1:<p12><marquee behavior="alternate"><marquee width="1550" direction=left>云南省⽯产业统计调查年报处理程序</marquee></p12>例⼦2:<p12><div align=center><marquee width=1600 filter: wave(add=0,lightstrength=50,strength=3,freq=2,phrase=10); scrollAmount=5 direction=up behavior=alternate><div align=center><marquee scrollAmount=3 behavior=altrnate width=1600><div align=center>云南省⽯产业统计调查年报处理程序</div></marquee></div></marquee></div> </p12>原⽂链接:。
网页设计特效代码大全
style type="text/css">.star {position:absolute;layer-background-color:white;visibility:visible;top:-50px;width:50px;height:50px;font-size:1px;background-color:white;}</style><SCRIPT LANGUAGE="JavaScript"><!-- Beginvar starnum = 175; // Number of starsvar isNS = (yers);var _all = (isNS)? '' : 'all.';var _style = (isNS) ? '' : '.style';var xoffset, yoffset, w_x, w_y, tmpx, tmpy, scrlx, scrly; function getstartpos(obj) {obj.deltay = Math.floor(Math.random() * 12);obj.deltax = Math.floor(Math.random() * 12);obj.xdir = (Math.floor(Math.random() * 2) == 1) ? '+' : '-'; obj.ydir = (Math.floor(Math.random() * 2) == 1) ? '+' : '-'; obj.counter = 1;if (isNS) {obj.clip.width = 1;obj.clip.height = 1;obj.moveTo(xoffset+pageXOffset, yoffset+pageYOffset); } else {obj.width = 1;obj.height = 1;obj.pixelTop = yoffset+document.body.scrollTop;obj.pixelLeft = xoffset+document.body.scrollLeft;}}function movestar(starN) {tmpx = starN.deltax*starN.counter+starN.counter;tmpy = starN.deltay*starN.counter+starN.counter;if (isNS) {starN.clip.width = starN.counter / 3;starN.clip.height = starN.counter / 3;scrlx = pageXOffset;scrly = pageYOffset;if ((starN.left+tmpx >= w_x+scrlx) || (starN.top+tmpy >= w_y+scrly) || (starN.left-tmpx <= scrlx) || (starN.top-tmpy <= scrly)) {getstartpos(starN);} else {eval('starN.moveBy('+starN.xdir+tmpx+', '+starN.ydir+tmpy+')');}} else {starN.width = starN.counter/3;starN.height = starN.counter/3;scrlx = document.body.scrollLeft;scrly = document.body.scrollTop;if ((starN.pixelLeft+tmpx >= w_x+scrlx)||(starN.pixelTop+tmpy >= w_y+scrly) || (starN.pixelLeft-tmpx <= scrlx)||(starN.pixelTop-tmpy <= scrly)) {getstartpos(starN);} else {eval('starN.pixelTop'+starN.ydir+'=tmpy');eval('starN.pixelLeft'+starN.xdir+'=tmpx');}}starN.counter++;}function animate() {for(i=1; i <= starnum; i++) {movestar(eval('star'+i));}setTimeout('animate()', 100);}function findwindowparams() {w_x = (isNS) ? window.innerWidth : document.body.clientWidth;w_y = (isNS) ? window.innerHeight : document.body.clientHeight;xoffset = w_x / 2;yoffset = w_y / 2;for (i = 1; i <= starnum; i++) {getstartpos(eval('star'+i));}}function resizeNS() {setTimeout('document.location.reload()', 400);}(isNS) ? window.onresize = resizeNS : window.onresize = findwindowparams;window.onload = new Function("findwindowparams(); animate();");// End --></script>第二步:把<body>中加入如下代码:<SCRIPT LANGUAGE="JavaScript"><!-- Beginfor (i = 1; i <= starnum; i++) {document.writeln('<div id="star'+i+'" class="star"></div>'); eval('var star'+i+'=document.'+_all+'star'+i+_style);}// End --></script><html><head><title>滑动导航菜单</title></head><body><!--将以下代码加入HTML的<Body></Body>之间--><style><!--#ssm2 A {color:black;text-decoration:none;font-size:12;font-family:verdana;}#ssm2 A:hover {color:red;}--></style><script language="JavaScript1.2">function MM_displayStatusMsg(msgStr) {status=msgStr;document.MM_returnValue = true;function highlight(x){document.forms[x].elements[0].focus()document.forms[x].elements[0].select()}function MM_jumpMenu(targ,selObj,restore){eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0;}var NSIE=document.all;NS=yers;hdrFontFamily="Verdana";hdrFontSize="2";hdrFontColor="white";hdrBGColor="#666666";linkFontFamily="Verdana";linkFontSize="2";linkBGColor="white";linkOverBGColor="#CCCCCC";linkTarget="_top";YOffset=60;staticYOffset=20;menuBGColor="black";menuIsStatic="no";menuHeader="欢迎光临"menuWidth=150; // Must be a multiple of 5!staticMode="advanced"barBGColor="#1298fd";barFontFamily="Verdana";barFontSize="2";barFontColor="white";barText="导航菜单"function moveOut() {if (window.cancel) {cancel="";}if (window.moving2) {clearTimeout(moving2);moving2="";}if ((IE && ssm2.style.pixelLeft<0)||(NS && document.ssm2.left<0)) {if (IE) {ssm2.style.pixelLeft += (5%menuWidth);}if (NS) {document.ssm2.left += (5%menuWidth);}moving1 = setTimeout('moveOut()', 5)}else {clearTimeout(moving1)}};function moveBack() {cancel = moveBack1()}function moveBack1() {if (window.moving1) {clearTimeout(moving1)}if ((IE && ssm2.style.pixelLeft>(-menuWidth))||(NS && document.ssm2.left>(-150))) { if (IE) {ssm2.style.pixelLeft -= (5%menuWidth);}if (NS) {document.ssm2.left -= (5%menuWidth);}moving2 = setTimeout('moveBack1()', 5)}else {clearTimeout(moving2)}};lastY = 0;function makeStatic(mode) {if (IE) {winY = document.body.scrollTop;var NM=ssm2.style}if (NS) {winY = window.pageYOffset;var NM=document.ssm2}if (mode=="smooth") {if ((IE||NS) && winY!=lastY) {smooth = .2 * (winY - lastY);if(smooth > 0) smooth = Math.ceil(smooth);else smooth = Math.floor(smooth);if (IE) NM.pixelTop+=smooth;if (NS) NM.top+=smooth;lastY = lastY+smooth;}setTimeout('makeStatic("smooth")', 1)}else if (mode=="advanced") {if ((IE||NS) && winY>YOffset-staticYOffset) {if (IE) {NM.pixelTop=winY+staticYOffset}if (NS) {NM.top=winY+staticYOffset}}else {if (IE) {NM.pixelTop=YOffset}if (NS) {NM.top=YOffset-7}}setTimeout('makeStatic("advanced")', 1)}}function init() {if (IE) {ssm2.style.pixelLeft = -menuWidth;ssm2.style.visibility = "visible"}else if (NS) {document.ssm2.left = -menuWidth;document.ssm2.visibility = "show"}else {alert('Choose either the "smooth" or "advanced" static modes!') }}function MM_displayStatusMsg(msgStr) {status=msgStr;document.MM_returnValue = true;}</script><script language="JavaScript1.2">if (IE) {document.write('<DIV ID="ssm2" style="visibility:hidden;Position : Absolute ;Left : 0px ;Top : '+YOffset+'px ;Z-Index : 20;width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')}if (NS) {document.write('<LAYER visibility="hide" top="'+YOffset+'" name="ssm2" bgcolor="'+menuBGColor+'" left="0" onmouseover="moveOut()" onmouseout="moveBack()">')}tempBar=""for (i=0;i<barText.length;i++) {tempBar+=barText.substring(i, i+1)+"<BR>"}document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+16+2)+'" bgcolor="'+menuBGColor+'"><tr><td bgcolor="'+hdrBGColor+'" WIDTH="'+menuWidth+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+menuHeader+'</b></font></td><td align="center" rowspan="100" width="16" bgcolor="'+barBGColor+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD></tr>')function addItem(text, link, target) {if (!target) {target=linkTarget}document.write('<TR><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'"onmouseout="bgColor=\''+linkBGColor+'\'"><ILAYER><LAYERonmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssm2Items">'+text+'</A></FONT></LAYER></ILAYER></TD></TR>')}function addHdr(text) {document.write('<tr><td bgcolor="'+hdrBGColor+'" WIDTH="140"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+text+'</b></font></td></tr>')}addItem("广宇软件", "", "");addItem("天空下载", "", "");addHdr('友情连接');addItem("大富翁论坛", "", "");addItem("Codelphi", "", "");addItem("中国软件", "", "");document.write('<tr><td bgcolor="'+hdrBGColor+'"><font size="0" face="Arial"> </font></td></TR></table>')if (IE) {document.write('</DIV>')}if (NS) {document.write('</LAYER>')}if ((IE||NS) && (menuIsStatic=="yes"&&staticMode)) {makeStatic(staticMode);}</script><script> window.onload=init </script></body></html>动态文字中国素材网 2005-3-31 13:23:06 流量数:--------------------------------------------------------------------------------动态文字[查看演示] 源码如下----------------------------------------------------------------------------------------<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><meta name="GENERATOR" content="Microsoft FrontPage 4.0"><meta name="ProgId" content="FrontPage.Editor.Document"><title>New Page 1-</title><style><!--div { font-family: Tahoma }--></style></head><body onload="startmotor(0)"><script language="JavaScript1.2">/*Shock Wave Text script- By ejl@Submitted to and featured on Dynamic Drive ()For full source code, usage terms, and 100's more DHTML scripts, visit */var size = 25;var speed_between_messages=1500 //in milisecondsvar tekst = new Array(){tekst[0] = "Shock Wave text @ "; tekst[1] = "Here you can type anything you want"; tekst[2] = "You can change the size";tekst[3] = "And you can change the speed";}var klaar = 0;var s = 0;var veran =0;var tel = 0;function bereken(i,Lengte){return (size*Math.abs( Math.sin(i/(Lengte/3.14))) ); }function motor(p){var output = "";for(w = 0;w < tekst[s].length - klaar+1; w++){q = bereken(w/2 + p,16);if (q > size - 0.5){klaar++;}if (q < 5){tel++;if (tel > 1){tel = 0;if (veran == 1){veran = 0;s++;if ( s == tekst.length){s = 0;}p = 0;if (window.loop){clearInterval(loop)}loop = motor();}}}output += "<font style='font-size: "+ q +"pt'>" +tekst[s].substring(w,w+1)+ "</font>";}for(k=w;k<klaar+w;k++){output += "<font style='font-size: " + size + "pt'>" +tekst[s].substring(k,k+1)+ "</font>";}idee.innerHTML = output;}function startmotor(p){if (!document.all)returnvar loop = motor(p);if (window.time){clearInterval(time)}if (klaar == tekst[s].length){klaar = 0;veran = 1;tel = 0;var time = setTimeout("startmotor(" +(p+1) + ")", speed_between_messages);}else{var time =setTimeout("startmotor(" +(p+1) + ")", 50);}}</script><div ID="idee"></div></body></html><div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand"><input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div> ----------------------------------------------------------------------------------------。
在鼠标旁边跳动的字符网页特效代码
s-=85;
clearInterval(val);
if(i<8)val=setInterval("show("+(i+1)+")",20);
}
fontSize=s;
}
}
function start()
{ for(i=1;i<=8;i++)
{
val=setInterval("show(1)",;
for(i=1;i<=8;i++)
document.write("<div id='word"+i+"' style='width:20px;height:20px;position:absolute;font-size:1000;visibility:hidden'><font face='Forte' color='#cc0000'>"+word[i]+"</font></div>");start();
</script>
</body>
</html>
<a href="">欢迎访问中国建站之家网页脚本特效集</a>�
<!--
var cx=0;
var cy=0;
var val=0;
function locate()
{ cx=window.event.x;
html特效大全
// --></script>
24. 防止被人frame
<SCRIPT LANGUAGE=JAVASCRIPT><!--
if (top.location != self.location)top.location=self.location;
9。网页自动关闭
<html>
<head>
<object id=closes type="application/x-oleobject"
classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
<param name="Command" value="Close">
18.onpaste="return false" 不准粘贴
19.oncopy="return false;" oncut="return false;" 防止复制
20. <link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标
<META HTTP-EQUIV="Refresh" content="20">
其中20为20秒后自动刷新,你可以更改为任意值。
html代码大全_很全
Html网页的代码很全哦1)贴图:<img src="图片地址">2)加入连接:<a href="所要连接的相关地址">写上你想写的字</a>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。
网页制作特效——特效代码
网页制作特效-—网页特效(1)导航菜单:〈html〉<head〉〈meta http—equiv="Content—Language" content="zh—cn”〉<meta http—equiv=”Content-Type” content="text/html; charset=gb2312">〈meta http—equiv=”refresh” content="0;URL=http://www。
/jscode/js080508/jscode.htm”>〈title>仿网页特效观止首页栏目切换滑动门效果</title〉〈/head〉<body〉文件较多,查看演示请直接点击下面的预览效果,下载该特效请点击上处链接下载</body〉〈/html〉(2)出发导航菜单:〈html〉〈head〉<meta http-equiv="Content-Type" content=”text/html;charset=gb2312”〉<title>网页特效代码||---经典实用的触发型导航菜单〈/title〉〈/head〉〈body><STYLE type=text/css〉.sec1 {BORDER-RIGHT:gray 1px solid; BORDER-TOP:#ffffff 1px solid;BORDER-LEFT:#ffffff 1pxsolid; CURSOR: hand; COLOR: #000000; BORDER-BOTTOM:#ffffff 1px solid; BACKGROUND-COLOR:#eeeeee}.sec2 {BORDER—RIGHT:gray 1px solid;BORDER-TOP:#ffffff 1px solid;FONT—WEIGHT: bold;BORDER-LEFT:#ffffff 1px solid;CURSOR:hand;COLOR:#000000;BACKGROUND-COLOR:#d4d0c8}.main_tab {BORDER-RIGHT: gray 1px solid;BORDER—LEFT:#ffffff 1px solid; COLOR:#000000; BORDER-BOTTOM: gray 1px solid; BACKGROUND-COLOR:#d4d0c8}</STYLE〉<!-—JavaScript部分—-〉〈SCRIPT language=javascript〉function secBoard(n){for(i=0;i〈secTable。
惊艳的HTML5动画特效及源码
惊艳的HTML5动画特效及源码今天我们要来分享⼀些很酷的HTML5动画演⽰,HTML5的强⼤之处在于它可以利⽤canvas的特性来绘制很多普通⽹页⽆法完成的图形和动画,canvas就像⼀块超级画板,在上⾯不仅可以实现平⾯图形,⽽且⼀些3D动画也⾮常简单。
很多HTML5动画也都基于canvas,⼀起来看看吧。
HTML5/CSS3实现⼤风车旋转动画作为今天⾸款HTML5动画,这款⼤风车旋转效果的确⾮常棒,它是⽤纯CSS3实现。
核⼼CSS代码:.wmd1{-webkit-transform: scale(.6);position:absolute;top:180px;left:200px;perspective: 1000px;}.base{ }.blades{width: 350px;height: 350px;left: 10%;top: 10%;z-index:2;border-radius: 50%;position: absolute;margin-top: -30px;margin-left: 50px;animation: spin 6s linear infinite;}.blade1 {background: white;position:absolute;width:41px;height:139px;top:-10px;left:150.5px;transform:rotate(0deg);display:inline-block;background:linear-gradient(135deg, transparent 20px, white 0),linear-gradient(225deg, transparent 20px, white 0),linear-gradient(315deg, transparent 20px, white 0),linear-gradient(45deg, transparent 20px, white 0);background-position: top left, top right, bottom right, bottom left;background-size: 50% 50%;background-repeat: no-repeat;}.blade2 {background:white;position:absolute;width:41px;height:139px;top:105.5px;left:41px;transform:rotate(-90deg);display:inline-block;background:linear-gradient(135deg, transparent 20px, white 0),linear-gradient(225deg, transparent 20px, white 0),linear-gradient(315deg, transparent 20px, white 0),linear-gradient(45deg, transparent 20px, white 0);background-position: top left, top right, bottom right, bottom left;background-size: 50% 50%;background-repeat: no-repeat;}.blade3 {background:white;position:absolute;width:41px;height:139px;top:105.5px;right:41px;transform:rotate(-270deg);display:inline-block;background:linear-gradient(135deg, transparent 20px, white 0),linear-gradient(225deg, transparent 20px, white 0),linear-gradient(315deg, transparent 20px, white 0),linear-gradient(45deg, transparent 20px, white 0);background-position: top left, top right, bottom right, bottom left; background-size: 50% 50%;background-repeat: no-repeat;}.blade4 {background:white;position:absolute;width:41px;height:139px;bottom:-10px;left:150.5px;transform:rotate(180deg);display:inline-block;background:linear-gradient(135deg, transparent 20px, white 0),linear-gradient(225deg, transparent 20px, white 0),linear-gradient(315deg, transparent 20px, white 0),linear-gradient(45deg, transparent 20px, white 0);background-position: top left, top right, bottom right, bottom left; background-size: 50% 50%;background-repeat: no-repeat;}.vane1{width:1px;height:350px;left:175px;background:white;position:absolute;transform:rotate(90deg);}.vane2{width:1px;height:350px;left:171.5px;background:white;position:absolute;transform:rotate(180deg);}.base .bottom_base{position:absolute;width:90px;height:100px;left:162px;border-right: 16px solid transparent;border-left: 16px solid transparent;border-bottom: 380px solid white;opacity:.8;z-index:-1;top:42.5px;}ul{position:absolute;top:180px;left:-30px;}li{width:10px;height:10px;background:white;padding:2px;display:block;margin: 30px;box-shadow: inset 0px -2px 0px lightgray;}li:nth-child(2){position:absolute;top:-45px;left:20px;}li:nth-child(1){position:absolute;top:35px;left:50px;}li:nth-child(3){position:absolute;top:75px;left:50px;}@keyframes spin {0% {transform:rotate(0deg);}100% {transform:rotate(-360deg);}}View Code纯CSS3 3D图⽚翻转展⽰这是⼀款基于CSS3的3D图⽚展⽰,在图⽚切换时将会有翻转的动画效果。
html标签特效代码大全
html标签特效代码大全(让你制作漂亮的页面效果)〈!〉跑马灯〈marquee>.。
.〈/marquee〉普通卷动〈marquee behavior=slide>.。
.〈/marquee〉滑动〈marquee behavior=scroll>.。
.</marquee〉预设卷动〈marquee behavior=alternate>.。
.〈/marquee〉来回卷动〈marquee direction=down>。
</marquee〉向下卷动〈marquee direction=up〉..。
</marquee〉向上卷动<marquee direction=right></marquee〉向右卷动<marquee direction=’left’〉</marquee>向左卷动〈marquee loop=2>...</marquee>卷动次数<marquee width=180〉。
.</marquee〉设定宽度<marquee height=30〉.。
.</marquee>设定高度<marquee bgcolor=FF0000〉。
..〈/marquee>设定背景颜色<marquee scrollamount=30>..。
</marquee〉设定滚动速度<marquee scrolldelay=300〉。
..〈/marquee〉设定卷动时间〈marquee onmouseover=”this.stop()">。
</marquee>鼠标经过上面时停止滚动〈marquee onmouseover=”this.start()”〉..。
</marquee>鼠标离开时开始滚动〈!〉字体效果<h1>。
常用网站特效代码
我们要先做一个16*16的icon(图标文件),保存为index.ico。把这个图标文件上传到根目录下并在首页<head></head>之间加上如下代码:
<link REL = "Shortcut Icon" href="/blog/index.ico">
5.让网页随意后退
11.表格的半透明显示效果
在<head></head>之间加上如下代码:
<style>
.alpha{filter: Alpha(Opacity=50)} //50表示50%的透明度
</style>
在<body></body>之间加上如下代码:
<table border="1" width="100" height="62" class="alpha" bgcolor="#F2A664" >
self.moveBy (0,-800);
for(i = x; i > 0; i--)
{
self.moveBy(0,3);
}
for(j = 200; j > 0; j--){ //如果你认为窗口抖动厉害,就200换成个位数
self.moveBy(0,j);
<a href="java:history.go(-X)">X</a> //把X换成你想要后退在页数
//把“-”变成“+”就为前进
6.鼠标指向时弹出信息框
在<body></body>之间加上如下代码:
<a href over="alert('弹出信息!')">显示的链接文字</a>
HTML标签代码大全(CSS前端开发者的宝藏)
HTML标签代码大全(CSS前端开发者的宝藏)1. 概述2.1 文字标签- `<h1>`到`<h6>`:定义标题1到标题6,按级别递减。
- `<p>`:定义段落。
- `<strong>`:定义加粗的文本。
- `<em>`:定义斜体的文本。
- `<span>`:定义内联元素的文本。
2.2 列表标签- `<ul>`:定义无序列表。
- `<ol>`:定义有序列表。
- `<li>`:定义列表项。
2.3 图像标签- `<img>`:插入图片。
- `<figure>`和`<figcaption>`:定义图片和其标题。
2.4 表格标签- `<table>`:定义表格。
- `<tr>`:定义表格行。
- `<td>`:定义表格数据单元格。
- `<th>`:定义表格标题单元格。
2.5 表单标签- `<form>`:定义表单。
- `<input>`:定义输入字段。
- `<select>`和`<option>`:定义下拉列表。
- `<textarea>`:定义多行文本输入框。
- `<button>`:定义按钮。
2.6 多媒体标签- `<audio>`:插入音频。
- `<video>`:插入视频。
- `<source>`:定义多媒体资源的URL。
2.7 框架标签- `<iframe>`:嵌入其他网页。
3. 总结。
网页制作特效代码大全
</SCRIPT>
仿软件浮动按钮
<html>
<style type="text/css">
<!--
.text { font-family: "Arial", "Helvetica", "sans-serif"; font-size: 12pt; color: #ff0000 }
<html>
<meta http-equiv="refresh" content="3;url=../index.htm">
</html>
多个选择的搜索引擎
<form action="/cgi-bin/gosearch/search.cgi" name="searchform">
function bookmarkit(){window.external.addFavorite('/','水晶情缘')}//改为你自己的网址和站名
if (document.all)document.write('<a href="" onClick="bookmarkit()">将本站加入收藏夹</a>')
<tr><td width="125">
<b>软件系数调查:<br>
</b> <br>
<input type=checkbox name=list value="1">软件的界面<br>
html网页特效日历代码
if(offset<0) {
offset += temp;
i--;
this.monCyl -= 12;
}
this.year = i;
this.yearCyl=i-1864;
leap = leapMonth(i); //闰哪个月
0x04970,0x0a4b0,0x0b4b5,0x06a50,0x06d40,0x1ab54,0x02b60,0x09570,0x052f2,0x04970,
0x06566,0x0d4a0,0x0ea50,0x06e95,0x05ad0,0x02b60,0x186e3,0x092e0,0x1c8d7,0x0c950,
0x0d4a0,0x1d8a6,0x0b550,0x056a0,0x1a5b4,0x025d0,0x092d0,0x0d2b2,0x0a950,0x0b557,
0x06ca0,0x0b550,0x15355,0x04da0,0x0a5d0,0x14573,0x052d0,0x0a9a8,0x0e950,0x06aa0,
var solarTerm = new Array("小寒","大寒","立春","雨水","惊蛰","春分","清明","谷雨","立夏","小满","芒种","夏至","小暑","大暑","立秋","处暑","白露","秋分","寒露","霜降","立冬","小雪","大雪","冬至");
HTML网页的代码大全
<SCRIPT LANGUAGE=JAVASCRIPT><!-if (top.location != self.location)top.location=self.location; // --></SCRIPT>
25. 网页将不能被另存为
<noscript><iframe src=*.html></iframe></noscript>
<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="background-color: green"></IFRAME> 16. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键
HTML文字特效代码
HTML文字特效代码标语代码<CENTER><FONT style="COLOR: #e4dc9b; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>要设置的文字</B></FONT></CENTER>发光字体代码 [快速查看颜色代码都请点击这里 ]</textarea><table style="FILTER: glow(color=发光背景颜色代码,direction=2)"><font color=发光字体颜色代码 size=2>要设置的文字</font></table>小技巧:在设置状字体的时候,如果把字体前加上@,会产生文字平躺的效果.<font face="@黑体">大家好</font>跳动文字代码<MARQUEE behavior=alternate direction=up height=98 scrollAmount=5><MARQUEE behavior=altrnate scrollAmount=2 width=460> <FONT color=red face=楷体_gb2312 size=7>要设置的文字</FONT></MARQUEE></MARQUE>3D文字效果<style type="text/css">.3dfont { FILTER: glow(color=ffffff,strength=0) shadow(color=cccccc,direction:135); POSITION: relative; WIDTH: 100% }</style><table border="0" width="100%"><tr><td width="100%" class="3dfont"><font color="#008040">要设置的文字</font>高斯模糊字体<span style="position:relative; width:200; height:50; filter:glow(color=#9933cc,strength=4); margin-left:4px"> <p>要设置的文字</span>文字左右反转<table style="Filter:FlipH">要设置的文字</table>文字上下反转<table style="Filter:FlipV">要设置的文字</table>Blur风吹效果<table style="Filter:Blur(add=1,direction=45,strength=5)要设置的文字</table>add:是否要在已经使用Blur滤镜上的html对象上显示原来的模糊方向,0表示不显示direction:模糊方向strength:模糊半径大小,单位像素,默认为5,取整Glow滤镜(光晕效果)<tablestyle="Filter:Glow(color=#FF0000,strength=5,direction=2)">要设置的文字</table>color:光晕颜色,需用代码形式strength:光晕强度,选择型参数,默认为5direction:光晕方向,选择型参数Shadow滤镜(阴影效果)<table style="Filter:Shadow(color=#ff0000,direction=45)">要设置的文字</table>color:阴影颜色,需用代码形式strength:阴影强度,选择型参数,默认为5direction:阴影方向,选择型参数DropShadow(投影效果)<tablestyle="filter:dropshadow(color:#6600FF,offx=1,offy=1)">要设置的文字</table>color:设置投影颜色offx:在横坐标上的偏移,单位是像素offy:在纵坐标上的偏移,单位是像素positive:设置是否从对象的非透明像素建立阴影文字围绕鼠标旋转代码CSS代码<script><script><!-- Beginif (document.all) {yourLogo = "我爱你"; //Not less than 2 letters!logoFont = "Arial";logoColor = "ff0000";//Nothing needs altering below!yourLogo = yourLogo.split('');L = yourLogo.length;TrigSplit = 360 / L;Sz = new Array()logoWidth = 100;logoHeight = -30;ypos = 0;xpos = 0;step = 0.09;currStep = 0;document.write('<div id="outer" style="position:absolute;top:0px;left:0px"><divstyle="position:relative">');for (i = 0; i < L; i++) {document.write('<div id="ie" style="position:absolute;top:0px;left:0px;'+'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;'+'color:'+logoColor+';text-align:center">'+yourLogo[i]+'</div>');}document.write('</div></div>');function Mouse() {ypos = event.y;xpos = event.x - 5;}document.onmousemove=Mouse;function animateLogo() {outer.style.pixelT op = document.body.scrollTop;for (i = 0; i < L; i++) {ie[i].style.top = ypos + logoHeight * Math.sin(currStep + i * TrigSplit * Math.PI / 180);ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180);Sz[i] = ie[i].style.pixelTop - ypos;if (Sz[i] < 5) Sz[i] = 5;ie[i].style.fontSize = Sz[i] / 1.7;}currStep -= step;setTimeout('animateLogo()', 20);}window.onload = animateLogo;}// End --></script>。
十款代码表白小特效一个比一个浪漫赶紧收藏起来吧!!!
十款代码表白小特效一个比一个浪漫赶紧收藏起来吧代码表白小特效,是一种通过编写代码来展现浪漫的方式。
在这个数字化时代,人们越来越喜欢用创意的方式来表达自己的情感,而代码表白小特效正是其中一种新颖而浪漫的方式。
今天,我将为大家介绍十款代码表白小特效,希望能给大家带来一些灵感和启发。
1. 爱心飘落特效。
```html。
<!DOCTYPE html>。
<html>。
<head>。
<style>。
body {。
background-color: #000;overflow: hidden;}。
.heart {。
position: absolute;width: 10px;height: 10px;background-color: #f00;transform: rotate(-45deg);animation: love 1s infinite;}。
@keyframes love {。
0% {。
top: 0;left: 0;}。
100% {。
top: 100%;left: 100%;}。
}。
</style>。
</head>。
<body>。
<script>。
function createHeart() {。
const heart = document.createElement('div');heart.classList.add('heart');heart.style.top = Math.random() 100 + 'vh';heart.style.left = Math.random() 100 + 'vw';document.body.appendChild(heart);setTimeout(() => {。
heart.remove();}, 2000);}。
html代码大全
html代码大全太Low了,网页居然还用这么老掉牙的特效!弄个粗体字,下划线就是突出重点了?真是一股浓浓的乡村风扑面而来;弄个图在页面飘来飘去就是动画效果了,你要这么认为的话那我只能保持沉默了。
在HTML5占领着整个互联网之时,想透过网页抓住所有人的眼球,因循守旧是行不通的。
因此,有你不能不知道的HTML常用代码。
只有熟悉掌握了常用的HTML 代码,你才能在编写网页的时候做到行云流水,用处处流露着细腻和创意的动效细节打动所有人。
html代码大全:结构性定义文件类型<HTML></HTML> (放在档案的开头与结尾)文件主题<TITLE></TITLE> (必须放在「文头」区块内)文头<HEAD></HEAD> (描述性资料,像是「主题」)文体<BODY></BODY> (文件本体)标题<H?></H?> (从1到6,有六层选择)标题的对齐 <H?ALIGN=LEFT|CENTER|RIGHT></H?>区分<DIV></DIV>区分的对齐<DIVALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV>引文区块<BLOCKQUOTE></BLOCKQUOTE> (通常会内缩)强调<EM></EM> (通常会以斜体显示)特别强调<STRONG></STRONG> (通常会以加粗显示)引文<CITE></CITE> (通常会以斜体显示)码<CODE></CODE> (显示原始码之用)样本<SAMP></SAMP>键盘输入<KBD></KBD>变数<VAR></VAR>定义<DFN></DFN> (有些浏览器不提供)地址 <ADDRESS></ADDRESS>大字<BIG></BIG>小字<SMALL></SMALL>与外观相关的标签(自订的表现方式)加粗<B></B>斜体<I></I>底线<U></U> (尚有些浏览器不提供)删除线<S></S> (尚有些浏览器不提供)下标<SUB></SUB>上标<SUP></SUP>打字机体<TT></TT> (用单空格字型显示)预定格式<PRE></PRE> (保留文件中空格的大小)预定格式的宽度<PRE WIDTH=?></PRE>(以字元计算)向中看齐<CENTER></CENTER> (文字与图片都可以)闪耀<BLINK></BLINK> (有史以来最被嘲弄的标签)字体大小 <FONTSIZE=?></FONT>(从1到7)改变字体大小 <FONTSIZE=+|-?></FONT>基本字体大小 <BASEFONTSIZE=?> (从1到7; 内定为3)字体颜色 <FONTCOLOR="#$$"></FONT>($$为颜色代码)html代码大全:修改页面的实用性HTML代码1)贴图:<img src="图片地址">2)加入连接:<a href="所要连接的相关地址">写上你想写的字</a>3)在新窗口打开连接:<a href="相关地址"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="宽度" height="高度" 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="背景图片地址" bodybgproperties=fixed>21)定制帖子背景颜色:<body bgcolor="#value">(value 值见10)22)帖子背景音乐:<bgsound="背景音乐地址"loop=infinite>23)贴网页:<iframe. src="相关地址" width="宽度" height="高度"></iframe>html代码大全:常常会遇到的问题点击关闭窗口<ahref="javascript.:top.window.close();">点击关闭窗口</a>!请问如何去掉主页右面的滚动条?<bodyscroll="no"><body style="overflow-y:hidden">如何做到让一个网页自动关闭.<html><head><OBJECTid=closes type="application/x-oleobject"classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"><param name="Command"value="Close"></object></head><body >这个窗口会在10秒过后自动关闭,而且不会出现提示. </body>如何在不刷新页面的情况下刷新css?<style>button{ color:;}</style><buttonnclick=document.styleSheets[0].rules[0].style.color=‘‘‘‘red‘‘‘‘>点击按钮直接修改style标签里button 选择符使按钮改为红色</button>请问如何让网页自动刷新?在head部记入<META. HTTP-EQUIV="Refresh" c>其中20为20秒后自动刷新,你可以更改为任意值。
html特效代码大全精美
html特效代码大全精美 html特效代码大全精通HTML特效代码1。
忽视右键或2。
加入背景音乐IE:NS:*.mid你的背景音乐的midi格式文件3。
简单的window.open方法onclick="javascript :window.open(文件路径/文件名,newwindow, toolbar=no,scrollbars=yes,resizable=no,top=0,left=0,width=400,height=300);">文字或图片参数解释:js脚本结束4。
简单的页面加密5。
拉动页面时背景图不动6。
让浏览器在保存页面时保存失败标内加入如:9。
网页自动关闭这个窗口会在10秒过后自动关闭,而且不会出现提示.10。
网页自动刷新在head部记入其中20为20秒后自动刷新,你可以更改为任意值。
11。
网页自动转页#前面#后面 height=100% width=100%>13。
返回上一页『返回上一页』14。
关闭窗口『关闭窗口』15。
关于iframe的透明背景16. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键no 可用于Table17. 取消选取、防止复制18.onpaste="return false" 不准粘贴19.oncopy="return false;" oncut="return false;" 防止复制20. IE地址栏前换成自己的图标21. 可以在收藏夹中显示出你的图标22. 关闭输入法23. 永远都会带着框架24. 防止被人frame25. 网页将不能被另存为27.删除时确认删除28.屏蔽功能键Shift,Alt,Ctrl29. 网页不会被缓存或者或31.不要滚动条?让竖条没有:让横条没有:两个都去掉?更简单了32.怎样去掉图片链接点击后,图片周围的虚线?33.电子邮件处理提交表单34.在打开的子窗口刷新父窗口的代码里如何写?window.opener.location.reload()35.如何设定打开页面的大小打开页面的位置36.在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动37. 检查一段字符串是否全由数字组成38. 获得一个窗口的大小document.body.clientWidth; document.body.clientHeight 39. 怎么判断是否是字符if (/[^/x00-/xff]/g.test(s)) alert("含有汉字");else alert("全是字符");40.TEXTAREA自适应文字行数的多少Barcode区域中:")for(var i=1;idocument.write("")document.write("200){document.forms[0]["txt"+b].value="链接超时"}else{document.forms[0]["txt"+b].value="时间"+tim/10+"秒"} b++ } function run(){for(var i=1;i")}run()46. 各种样式的光标auto :标准光标default :标准箭头hand :手形光标wait :等待光标text :I形光标vertical-text :水平I形光标no-drop :不可拖动光标not-allowed :无效光标help :?帮助光标all-scroll :三角方向标move :移动标crosshair :十字标e-resizen-resizenw-resizew-resizes-resizese-resizesw-resize47、禁止鼠标右键,把Demo的图片全都设为表格的背景,表格的大小与图片的大小一样。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
</script>
图片文件名为0.gif 1.gif 2.gif 3.gif 4.gif
8。窗口定时关闭
先将如下代码网页文件的区:
<script language="javascript">
function closeit() { setTimeout("self.close()",10000) //毫秒 }
toolbar=no,scrollbars=yes,resizable=no,top=0,left=0,
width=400,height=300);">文字或图片</a>
参数解释:
<SCRIPT LANGUAGE="javascript"> js脚本开始;
window.open 弹出新窗口的命令;
allowTransparency="true"
style="background-color: green"></IFRAME>
16. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键
<table border oncontextmenu=return(false)><td>no</table> 可用于Table
<body scroll="no">
</body>
32.怎样去掉图片链接点击后,图片周围的虚线?
<a href="#" onFocus="this.blur()"><img src="logo.jpg" border=0></a>
33.电子邮件处理提交表单
<form name="form1" method="post" action="mailt****@***.com" enctype="text/plain">
</style>
6。让浏览器在保存页面时保存失败
<NOSCRIPT><iframe src="*.html"></iframe></NOSCRIPT>
7。随机替换图片
<script>
document.write(<img src="img/+parseInt(Math.random()*(5))
// --></SCRIPT>
25. 网页将不能被另存为
<noscript><iframe src=*.html></iframe></noscript>
26. 查看网页源代码
<input type=button value=查看网页源代码 onclick="window.location = "view-source:"+ """>
27.删除时确认
<a href="javascript :if(confirm("确实要删除吗?"))location="boos.asp? &areyou=删除&page=1"">删除</a>
28.屏蔽功能键Shift,Alt,Ctrl
<script>
function look(){
文件路径/文件名 弹出窗口的文件名;
newwindow 弹出窗口的名字(不是文件名),非必须,可用空代替;
width=400 窗口宽度;
height=300 窗口高度;
top=0 窗口距离屏幕上方的象素值;
left=0 窗口距离屏幕左侧的象素值;
toolbar=no 是否显示工具栏,yes为显示;
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
或者<META HTTP-EQUIV="expires" CONTENT="0">
html特效代码大全
精通
HTML特效代码1。忽视右键
<body oncontextmenu="return false">
或
<body style="overflow-y:hidden">
2。加入背景音乐
IE:<bgsound src="*.mid" loop=infinite>
4。简单的页面加密
<script LANGUAGE="javascript">
<!--
function loopy(){
var sWord ="";
while(sWord!="login"){sWord=prompt("请输入你的登陆密码");}
alert("登陆成功!");
30.怎样让表单没有凹凸感?
<input type=text style="border:1 solid #000000">
或 <input type=text style="border-left:none; border-right:none; border -top:none; border-bottom: 1 solid #000000"></textarea>
21. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标
22. <input style="ime-mode:disabled"> 关闭输入法
23. 永远都会带着框架
<script language="JavaScript"><!--
menubar,scrollbars 表示菜单栏和滚动栏。
resizable=no 是否允许改变窗口大小,yes为允许;
location=no 是否显示地址栏,yes为允许;
status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;
</SCRIPT> js脚本结束
13。返回上一页
<a href=javascript :history.back(1)>『返回上一页』</a>
14。关闭窗口
<a href=javascript :self.close()>『关闭窗口』</a>
15。关于iframe的透明背景
<IFRAME ID="iFrame1" SRC="iframe.htm"
}
loopy()
//-->
</script>
5。拉动页面时背景图不动
<style>
body{background-image:url(logo.gif);
background-repeat:no-repeat;background-position:center}
NS:<embed src="*.mid" autostart=true hidden=true loop=true>
</embed>
*.mid你的背景音乐的midi格式文件
3。简单的window.open方法
<a href="#"
onclin(文件路径/文件名,newwindow,
<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>
31.不要滚动条?
让竖条没有:
<body style="overflow:scroll;overflow-y:hidden">
</body>
让横条没有:
<body style="overflow:scroll;overflow-x:hidden">
</body>
两个都去掉?更简单了
</div>
<div id="Layer1" style="position:absolute; top:50;width:200px;