建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

当前位置: 建站学 > 网页设计 > css教程 >

第5页:css叠放文字和图象

时间:2009-03-05 18:28来源: 作者: 点击:
下面我将要谈到我一直吹嘘的在页面上重叠 要素的方法。它不是通过设定边距负值或采 用更小的行高来实现,而是通过.css:.....
下面我将要谈到我一直吹嘘的在页面上重叠 要素的方法。它不是通过设定边距负值或采 用更小的行高来实现,而是通过.css:.....

z-index

当你定位多个要素并将其重叠时,你可以使 用z-index来设定哪一个要素应出现在最上 层。

    H2 { position: relative; left: 10px; top: 0px; z-index: 10 } H1 { position: relative; left: 33px; top: -35px; z-index: 1 }

观察这条CSS规则的执行效果(我将<H2>的 文字设为绿色,以便你观察其不同之处):

Stylesheets

Mania

由于<H2>文字的z-index参数值更高,所以 它显示在 <H1>文字的上面。(IE 4在MAC机 上执行这一项时会出问题,它会将<H1>放在 最上面。

该参数值使用纯整数。z-index用于绝对定 位或相对定位了的要素。

你也可以给图象设定z-index。(对于 Communicator,最好将 <IMG>标签包在 <SPAN>或 <DIV>标签内,然后将z-index 应用到<SPAN>或 <DIV>。)

返回本专题:《CSS层叠样式表教程》的目录

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片