使用Cascading Style Sheet建立Layer

margin属性的一个有趣的应用是用于建立layer，通过使用margin属性，你可以将一段文字放置在另一段文字的上面，就象下面的例子所示（见图7.35）：

<HTML>

<HEAD>

<TITLE> STYLE </TITLE>

<STYLE>

BODY {margin: 50pt}

.BottomLayer {color: gray; font: 100px “Comic Sans MS”}

.TopLayer {margin-top: -100px; color: yellow; font: italic 40px Verdana}

</STYLE>

</HEAD>

<BODY>

<P CLASS=BottomLayer> BACKGROUND

<P CLASS=TopLayer> FOREGROUND </P> </P>

</BODY>

</HTML>

图7.35 建立覆盖文本

注意此例中为上层文字的margin属性使用的负值，负值将上层文字上移了100个象素，你可以通过这种方法放置任意多的layer。

还要注意上层文字位于底层文字中。上层文字的<P>标识符包含在底层文字的<P>标识符之中，这就迫使上层文字的空白要依据底层文字来计算。