HTML代码

黑客动画:http://bbs.77169.com/read.php?tid=102582 

在另一地方粘的一些代码,方便经常学习.

为显示代码,在代码中添加了(*)

使用时可以去掉(*)

一、一般的文字代码:

P align=CENTER---LEFT,RIGHT(分别为文字:中,左,右)

FONT color=颜色---为文字颜色(可以选择BLACK,BLUE,WHITE.RED,OLIE,GREEN及颜色代码等等)

face=隶书,宋体,黑体等等(为文字样式)

size=5(为文字大小,分别为1----7进行调整)

(1)文字居中

<*P align=center><*FONT color=颜色 face=隶书 size=5>梅风剑祝大家新年快乐<*/FONT><*/P>

(2)文字靠右

<*P align=RIGHT><*FONT color=颜色 face=隶书 size=5>梅风剑祝大家新年快乐<*/FONT><*/P>

(3)文字靠左

<*P align=LEFT><*FONT color=颜色 face=隶书 size=5>梅风剑祝大家新年快乐<*/FONT><*/P>

二、文字向左移动代码:

<*marquee directio=left><*font face=华文楷体 size=4 color==#ff0000>梅风剑祝大家新年快乐<*/font><*/marquee>

三、文字向上滚动代码:

<*marquee direction=up scrollamount=2><*center><*font color="#ff0000" size="5" face="华文楷体">梅风剑祝大家新年快乐<*/font><*/marquee>


四、文字向下滚动代码:

<*marquee direction=down scrollamount=2><*center><*font color="#ff0000" size="5" face="华文楷体">梅风剑祝大家新年快乐<*/font><*/marquee>

五、有背景的文字:

<*TABLE cellSpacing=0 cellPadding=0 align=center background=http://mfj518.bokee.com/inc/meifengjiangongzuoshi.gif>
<*TBODY>
<*TR>
<*TD style="FILTER: chroma(color=#336699)">
<*TABLE align=center bgColor=red>
<*TBODY>
<*TR>
<*TD align=middle>
<*P><*FONT style="FONT-SIZE: 100pt" face=文鼎花瓣体 color=#336699><*B>梅<*/B><*/FONT><*/P>
<*P><*FONT style="FONT-SIZE: 100pt" face=文鼎花瓣体 color=#336699><*B>风<*/B><*/FONT><*/P>
<*P><*FONT style="FONT-SIZE: 100pt" face=文鼎花瓣体 color=#336699><*B>剑<*/B><*/FONT><*/P>
<*P><*FONT style="FONT-SIZE: 100pt" face=文鼎花瓣体 color=#336699><*B>工<*/B><*/FONT><*/P>
<*P><*FONT style="FONT-SIZE: 100pt" face=文鼎花瓣体 color=#336699><*B>作<*/B><*/FONT><*/P>
<*P><*FONT style="FONT-SIZE: 100pt" face=文鼎花瓣体 color=#336699><*B>室<*/B><*/FONT><*/P>
<*/TD><*/TR><*/TBODY><*/TABLE><*/FONT>

<*/TD><*/TR><*/TBODY><*/TABLE>


六、有阴影的文字:

1.<*P align=center><*FONT style="FONT-SIZE: 30pt; FILTER: glow(color=#00FFFF); WIDTH: 100%; COLOR: #f8f8ff; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><*B>梅风剑祝大家新年快乐<*/B><*/FONT><*/P>

2.<*CENTER><*FONT style="FONT-SIZE: 20pt; FILTER: glow(color=#7CFC00); WIDTH: 100%; COLOR: yellow; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><*B>梅风剑祝大家新年快乐<*/B><*/FONT><*/CENTER>

3.<*CENTER><*FONT color=red style="FILTER: blur(add=1,direction=40,strength=10); FONT-SIZE: 30px; FONT-WEIGHT: bolder; POSITION: relative; WIDTH: 500px">梅风剑祝大家新年快乐<*/FONT><*/CENTER>

4.<*DIV align=center><*DIV style="FILTER: shadow(color=#c299ff, strength=60); WIDTH: 530px"> <*FONT color=#FFFF00 face=隶书 size=7><*center><*BR> 梅风剑祝大家新年快乐<*BR> 祝大家新年快乐<*BR><*BR> <*BR><*BR> <*/div><*/div>


七、空心字的代码:

<*CENTER><*FONT style="COLOR: red; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%">梅风剑祝大家新年快乐<*/FONT><*/CENTER>


八、突出边框的代码:

1.<*CENTER><*FONT style="COLOR: red; FILTER: glow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%">梅风剑祝大家新年快乐<*/FONT><*/CENTER>

2.<*center><*SPAN style='width:400;filter:glow(color=red,strength=2);color:white;font-size:20pt'><*FONT color=#000000 face=隶书 size=7>梅风剑祝大家新年快乐<*/FONT><*/SPAN><*/center>


九、五颜六色的字:

<*font color="#FF0000">梅<*/font><*font color="#D52A00">风<*/font><*font color="#AB5400">剑<*/font><*font color="#817E00">工<*/font><*font color="#57A800">作<*/font><*font color="#2DD200">室<*/font>


十、环绕字:

<*SCRIPT language=javascript>function lib2bwcheck(){this.ver=navigator.appVersion;

this.agent=navigator.userAgent;this.dom=document.getElementById?1:0;this.opera5=this.agent.indexOf("Opera 5")>-1;this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0; this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;this.ie4=(document.all && !this.dom && !this.opera5)?1:0;this.ie=this.ie4||this.ie5||this.ie6;this.mac=this.agent.indexOf("Mac")>-1;this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0; this.ns4=(document.layers && !this.dom)?1:0;this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5);return this;}var bw=new lib2bwcheck();var px = bw.ns4||window.opera?"":"px";function run() {var cx, cy, a;var css, obj, nest, ooo;if ((document.all) && (!bw.opera5)) {movy = document.body.clientHeight-64;movx = document.body.clientWidth-50;} else {movx = window.innerWidth-50; movy = window.innerHeight-64;}for (var i=0; isdto || oy<*sdfrom) { yspeed=-yspeed; oy+=yspeed;}ox+=xspeed;setTimeout("run()",tpause);}var sxfrom=50;var sxto=40;var syfrom=50;var syto=20;var sdfrom=50;var sdto=100;var yspeed=1;var xspeed=4;var pcol=Number(255).toString(16);var tpause=20;var schar="梅风剑祝大家新年快乐☆";var maxitems = schar.length;var t=0;t = pcol.length;for (var i=0; i<6-t; i++) pcol = "0"+pcol;if (document.all) {movy = document.body.clientHeight-64;movx = document.body.clientWidth-50;} else {movx = window.innerWidth-50;movy = window.innerHeight-64;}var ox, oy;ox=Math.PI; oy=sdfrom;xspeed = xspeed*Math.PI/180;pa = new Array();for (var i=0; i<*maxitems; i++) {document.writeln("<*div id=s"+i+" style=position:absolute;top:280;z-index>");document.writeln("<*table style=filter:glow(color=red strength=1)><*th><*font color=#00ffff face=华文楷体 style=font:39pt>"+schar.substr(i,1)+"<*/font><*/th><*/table>");document.writeln("<*/div>");}setTimeout("run()",tpause);<*/SCRIPT>


十一、上下左右移动:

<*center><*table width=500><*tr><*td><*font color=#991144&><*marquee behavior=alternate><*MARQUEE behavior=alternate><*FONT face=宋体 color=red size=4><*MARQUEE direction=up behavior=alternate width=60 height=120>梅<*/MARQUEE><*FONT color=orange> <*MARQUEE direction=up behavior=alternate width=60 height=80>风<*/MARQUEE><*FONT color=#FF8CA9><*MARQUEE direction=up behavior=alternate width=60 height=120>剑!<*/MARQUEE><*FONT color=green> <*MARQUEE direction=up behavior=alternate width=60 height=80>工<*/MARQUEE><*FONT color=blue><*MARQUEE direction=up behavior=alternate width=60 height=120>作<*/MARQUEE><*FONT color=lime> <*MARQUEE direction=up behavior=alternate width=60 height=80>室<*/MARQUEE><*/FONT><*/FONT><*/FONT>

<*/FONT><*/FONT><*/FONT><*/marquee>

<*/font><*/td><*/tr><*/table><*/center>

十二、向两边扩展的代码:

<*FONT color=#FFFF00 face=隶书 size=7><*MARQUEE height=50 width=240>梅风剑祝大家新年快乐!<*/FONT><*/MARQUEE><*FONT color=#00FF00 face=隶书 size=7><*MARQUEE direction=right height=50 width=240>!乐快年新家大祝剑风梅<*/MARQUEE><*/FONT>


十三、向上循环的代码:

<*marquee direction=up height=200 scrollamount=1 scrolldelay=90 <*CENTER><*FONT style="COLOR: #FFFF00; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%">梅风剑祝大家新年快乐!<*/FONT><*/CENTER><*/marquee>


十四、向左移动(忽隐忽现)的代码:

<*CENTER><*MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><*B><*FONT color=#FFFF00 face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">梅<*IMG src="<*/FONT><*/B><*/MARQUEE">";><*/FONT><*/B><*/MARQUEE> <*MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><*B><*FONT color=#FFFF00 face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">风<*IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" _fcksavedurl=""http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif"" ;><*/FONT><*/B><*/MARQUEE> <*MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><*B><*FONT color=#FFFF00 face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">剑<*IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;><*/FONT><*/B><*/MARQUEE> <*MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><*B><*FONT color=#FFFF00 face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">!<*IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;><*/FONT><*/B><*/MARQUEE>

<*/CENTER>


十五、图上做字效果:

<*center><*table border="5" width="365" height="320" background="图片链接地址"> <*tr> <*td> <*br> <*br><*br><*br><*br><*br><*br><*br><*br>

<*br><*br><*br><*br> <*p align="center"><*font color="#FFFF00">梅风剑祝大家新年快乐<*/font><*/p><*/td> <*/tr> <*/table>


十六、文字代码说明:

1.align=center:表示字体居中,可选值为居右(right)、居左(left)。

2.color=颜色代码。字体属性是:face 颜色的属性是color。

3.face=字体。常用字体为:文鼎花瓣体、宋体、黑体、楷体、仿宋、幻缘、新宋体、细明体、隶书、幼圆、华文琥珀、华文行楷、华文彩云(用做题目)、华文细黑、华文新魏、华文中宋、方正舒体、方正姚体、仿宋_GB2312.楷体_GB2312、宋体-方正超大字符集、汉鼎繁中变、华文楷体。

4.size=字体大小,这里的最大值为7,取值越大文字就越大。

5.文字标记是“<*font>”可以用“<*font>”标记的不同属性来分别设置文本中文字的大小,字体,字型,字色等。<*Font>标记的格式是:<*font 属性=属性值>被设置的字<*/font>。

6.<*BR>是文字换行

7.<*P>是段控制。标记是<*p>放在文字后,使得其后文字空一行后换行显示。<*p>的属性align用来设置文字的对齐方式。属性值是center(居中对齐),left(向左对齐),right(向右对齐)。

8.下划线:<*U><*/U>


十七、移动文字代码说明:

1.left:向右移动。right:向左移动。alternate:来回走。

2.scrollamount:移动速度。scrolldelay:停停走走。direction=up:向上。direction=down:向下。


十八、让你的文字动起来——marquee用法详解:

A.参数一:direction

<*marquee direction=up>向上移动<*/marquee>

direction的英文意思就是方向。这个参数的取值有四个:left(左)、right(右)、up(上)、down(下)。

B.参数二:behavior
<*marquee direction=left behavior=alternate>哈哈,我来回走!<*/marquee>

scroll(循环移动)、slide(只移动一个回合)、alternate(来回移动)。

C.参数三:loop

循环。若未指定则循环不止(infinite),其值取数值。例:

<*marquee loop=3>我只走三次哦<*/marquee>

D.参数四:scrollamount

移动速度。值取正整数。数值越大,速度越快。例:

<*marquee scrollamount=25>看,我走多快!<*/marquee>

E.参数五:scrolldelay

延时。数值。例:

<*marquee scrolldelay=1000>我走一走,停一停<*/marquee>

F.参数六:bgcolor

底色。例:

<*marquee bgcolor=pink>看到了吧?有底色!<*/marquee>

G.参数七:width和height

就是移动的宽度与高度了。例:

<*marquee width=200 height=200 bgcolor=pink direction=down><*center>这个面积不够我移动!<*/center><*/marquee>

H.其他参数:

空白(Margins)<*hspace=数值 vspace=数值>

对齐方式(Align) <*align=top/ middle/bottom>

十九、用CSS滤镜修饰文字:

1.Alpha滤镜

代码:

<*FONT style="FONT-SIZE:30pt;filter:alpha(opacity=100,style=3);WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT>

从效果中我们可以看出,Alpha滤镜使对象呈渐变透明的效果,其效果是由脚本中的filter:alpha(opacity=100,style=3)来决定的。其中:

opacity属性:设置透明度,取值0至100之间的任意数值,100表示完全不透明; style属性:设置渐变风格,0表示均匀渐变,1表示线性渐变,2表示放射渐变,3表示直角渐变。

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

2.Motion Blur滤镜

Motion Blur滤镜表现的是一种模糊效果。其ADD属性是用来确定是否在运动模糊中使用原有目标,其值为0和1,0表示“否”,用于文字,1表示“是”,用于图像;Direction属性是模糊移动的角度,其值为0至360度;Strength属性是模糊移动的距离。

以下是代码:

<*FONT style="FONT-SIZE:30pt;filter:blur(add=1,direction=30,strength=5);WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT>

3.Drop Shadow滤镜

Drop Shadow滤镜主要产生重叠效果。其属性为:

color属性:设置影子文本的颜色;

offX和offY属性:影子文本下落的位移值;

Positive属性:指定透明象素阴影,布尔型,0为是,1为否。

代码:

<*FONT style="FONT-SIZE:30pt;filter:dropshadow(color=lightgreen,offX=5,offY=3,Positive=1);

WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*B><*/FONT>

4.Shadow滤镜

与Drop Shadow的影子特性不同,Shadow滤镜产生一种阴影效果,它的属性比较简单:

color属性:阴影颜色;

direction属性:阴影角度,值取0至360度。

代码:

<*FONT style="FONT-SIZE:30pt;filter:shadow(color=black,direction=180);WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT>

5.Wave滤镜

此滤镜对过滤对象生成正弦波变形,造成一种变幻效果。内嵌属性:

add属性:布尔型,0或1,0表示将原始对象加入最后效果中,1则反之;

freq属性:决定显示的频率,即应出现多少个波形;

phrase属性:决定波形的形状,值取0至360之间;

strength属性:决定波形的振幅。

代码:

<*FONT style="FONT-SIZE:30pt;filter:wave(add=0,lightstrength=50,strength=4,freq=2,phrase=30);

WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT>

6.Glow滤镜

Glow滤镜生成一种光晕效果。属性:

color属性:光晕颜色;strength:光晕的厚度。

代码:

<*FONT style="FONT-SIZE:30pt;filter:glow(color=gray,strength=4);WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT>

7.Flip滤镜

Flip滤滤镜主要是产生两种变换效果,即上下变换和左右变换。FlipV产生上下变换,FlipH产生左右变换。

代码:

<*FONT style="FONT-SIZE:30pt;filter:FlipV(color=silver);WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT>

<*p align=right><*FONT style="FONT-SIZE:30pt;filter:FlipH(color=silver);WIDTH:100%; COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><*B>梅风剑祝大家新年快乐<*/B><*/FONT><*/p>

8.Chroma 滤镜

语法:{filter:chroma(color=color)}

使用”Chroma"属性可以设置一个对象中指定的颜色为透明色,参数COLOR即要透明的颜色。

9.Light 滤镜

这个属性模拟光源的投射效果。一旦为对象定义了“LIGHT"滤镜属性,那么就可以调用它的“方法(Method)"来设置或者改变属性。“LIGHT"可用的方法有:

·AddAmbient 加入包围的光源

·AddCone 加入锥形光源

·AddPoint 加入点光源

·Changcolor 改变光的颜色

·Changstrength 改变光源的强度

·Clear 清除所有的光源

·MoveLight 移动光源

可以定义光源的虚拟位置,以及通过调整X轴和Y轴的数值来控制光源焦点的位置,还可以调整光源的形式(点光源或者锥形光源)指定光源是否模糊边界、光源的颜色、亮度等属性。如果动态的设置光源,可能回产生一些意想不到的效果。

10.Gray ,Invert,Xray 滤镜

语法:{filter:gray} ,{filter:invert},{filter:xray}

Gray滤镜是把一张图片变成灰度图;Invert滤镜是把对象的可视化属性全部翻转,包括色彩、饱和度、和亮度值;Xray滤镜是让对象反映出它的轮廓并把这些轮廓加亮,也就是所谓的“X”光片。

代码:

提示:CSS滤镜还经常用来修饰图像。比如用Flip滤镜,就可以使图像倒过来显示。最后请注意:要使用CSS滤镜,只有在HTML编辑模式下编辑发布才有效果。




下面这些对于新手很有用:
创建一个HTML文档 &lt;html&gt;&lt;/html&gt; <br>
  设置文档标题以及其他不在WEB网页上显示的信息 &lt;head&gt;&lt;/head&gt; <br>
  设置文档的可见部分 &lt;body&gt;&lt;/body&gt; <br>
<br>
             标 题 标 签<br>
<br>
  将文档的题目放在标题栏中 &lt;title&gt;&lt;/title&gt; <br>
<br>
            文 档 整 体 属 性<br>
  设置背景颜色,使用名字或十六进制值 &lt;body bgcolor=?&gt; <br>
  设置文本文字颜色,使用名字或十六进制值 &lt;body text=?&gt; <br>
  设置链接颜色,使用名字或十六进制值 &lt;body link=?&gt; <br>
  设置已使用的链接的颜色,使用名字或十六进制值 &lt;body vlink=?&gt; <br>
  设置正在被击中的链接的颜色,使用名字或十六进制值 &lt;body alink=?&gt; <br>
<br>
             文 本 标 签<br>
<br>
  创建预格式化文本 &lt;pre&gt;&lt;/pre&gt; <br>
  创建最大的标题 &lt;h1&gt;&lt;/h1&gt; <br>
  创建最小的标题 &lt;h6&gt;&lt;/h6&gt; <br>
  创建黑体字 &lt;b&gt;&lt;/b&gt; <br>
  创建斜体字 &lt;i&gt;&lt;/i&gt; <br>
  创建打字机风格的字体 &lt;tt&gt;&lt;/tt&gt; <br>
  创建一个引用,通常是斜体 &lt;cite&gt;&lt;/cite&gt; <br>
  加重一个单词(通常是斜体加黑体) &lt;em&gt;&lt;/em&gt; <br>
  加重一个单词(通常是斜体加黑体) &lt;strong&gt;&lt;/strong&gt; <br>
  设置字体大小,从1到7 &lt;font size=?&gt;&lt;/font&gt; <br>
  设置字体的颜色,使用名字或十六进制值 &lt;font color=?&gt;&lt;/font&gt; <br>
<br>

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值