< Layer(层)在主页中的运用 >
作者-田涛
目前,主页已经由静态逐步走向动态,虽然动态的某些技术细节还在W3C中讨论,但这并不影响我们的使用,
动态主页常被称作DHTML,而IE和Netscape各自都有自己的DHTML标签元素,而Layer目前是Netscape公
司独有的,顾名思义Layer意思是"层",利用Layer标签你可以在主页中同时重叠多个可视层,层就好象另
一个WEB页面，而且,利用JavaScript技术与Layer相结合,可以产生许多奇妙的页面动态效果.
一.Layer的语法
利用layer,你可以在原HTML文件上再显示任意多的层,它们可以是任何其它的内容,可以是 另一个HTML文
件,或是一幅图片,这些层都将按默认顺序重叠显示,那么,第一个层,称作母层,或叫定义层,其它各层将显
示于上,下面是层的标签元素:
< layer > 静心文章 < /layer >
与其它HTML标签一样,层的标签也要成对出现,它们也可以嵌套使用,产生多个层.当你使用以上标签时,在浏
览器显示时,并没有什么特别,而只是显示"静心文章",虽然这样,如果你利用了layer的其它属性,那么你会
发现层的变化是很多的.
layer其它属性:
bgcolor=xxxx
指定层的背景色,如果你不指定背景色,那么它将是透明的,当你只有母层时,如果没有指定背景颜色,那么它
将显示底下的文本;
background= "URL"
指定背景为一幅图片,URL代表图片的地址;
left=x top=y
指定层在浏览器中的位置,位置以浏览器窗口的左上角为准,如果你使用了多个层,那么其它层的位置将以母
层为准;
src="url"
指定层显示一个HTML文件,URL为HTML文件的地址;
width=x height=x
指定层的大小;
name="xxx"
为了区别层,可以为层命名,并且还能配合JavaScirpt来作出其它效果;
clip=x1, y1, x2, y2
为了达到某些效果,需要一些图层显示指定面积的内容,x1, y1 指layer最左上角的x,y轴的坐标值,而
X2,y2,指右下角坐标值.
zindex=n above=n+1 below=n-1
如果你使用了多个图层,它们会按照默认顺序显示,如果你想改变它们的顺序,就可以通过以上标签指定.
其中,zindex=n above=n+1 below=n-1 三个属性每次只能使用一个.
visibility=show
你可以指定图层的可见度,除了show,还有"hide"和"inherit",两个属性可选择.
二.Layer的运用实列
Layer的运用是很广泛的,但如果单独使用它,并不能产生太多效果,所以现在一般把它和JavaScript配合使
用,这样,你就能随心所欲的创造很多变化了,比如,在页面中,除显示原来HTML文件外,你还可以在上面建立
一个可以移动的层,来显示你要发布的信息,比如商家的广告等,还可以在页面中设置弹出式帮助(POP-UP),
单击某词语,出现另一个窗口,进行解释,这就是Layer的作用.在Layer中,你也能使用层叠样式表(CCS),来
指定层里内容的显示方式.
1.基本运用
一个层:
静心文章
< layer bgcolor=red >
Welcome to 静心文章
< /layer >
在该列子中,背景色是白色,而图层是红色,并且显示"Welcome to 静心文章"文字.
两个层:
静心文章
< layer bgcolor=red >
Welcome to 静心文章
< layer bgcolor=black>
静心的世界
< /layer >
< /layer >
在该列子中,背景色是白色,而母层是红色,并且显示"Welcome to 静心文章"文字,第二层背景色为黑色,
并显示文字"静心的世界",如果你不指定其它Layer属性,那么第二层将覆盖母层.
2.Layer与JavaScript
静心文章
欢迎光临静心!
欢迎光临静心!静心文章