哪些屬性可與 CSS-P 一同使用？

首先，此元素必須指定 position 屬性（relative 或 absolute）。

然后，我就可以設(shè)置下列 CSS-P 屬性了：

• left - 元素的左側(cè)位置
• top - 元素的頂端位置
• visibility - 指定元素應(yīng)當(dāng)可見還是隱藏
• z-index - 元素的堆疊次序
• clip - 元素裁剪
• overflow - 如何處理溢出的內(nèi)容

Position

CSS 的 position 屬性允許您控制文檔中某個元素的定位。

position:relative

position:relative 屬性可向?qū)τ谝粋�元素的當(dāng)前位置來定位此元素。

下面的例子把這個 div 元素定位到距離其正常位置右方 10 像素的位置：

div
{
position:relative;
left:10;
}

position:absolute

position:absolute 屬性根據(jù)距離窗口的 margin 來定位一個元素。

下面的例子把這個 div 元素定位到距離其包含塊左側(cè) margin 的右方 10 像素的位置：

div
{
position:absolute;
left:10;
}

Visibility

visibility 屬性可決定一個元素是否可見。

visibility:visible

visibility:visible 屬性可使元素可見。

h1
{
visibility:visible;
}

visibility:hidden

visibility:hidden 屬性可使元素不可見。

h1
{
visibility:hidden;
}

Z-index

z-index 屬性用于把一個元素放置于另一個元素之后。z-index 的默認(rèn)值是 0。值越高，其優(yōu)先權(quán)也越高。z-index: -1 更低的優(yōu)先權(quán)。

h1
{
z-index:1;
}

h2
{
z-index:2;
}

在上面的例子中，如果 h1 和 h2 彼此疊加，則 h2 元素會位于 h1 的上面。

Filters

filter 屬性允許您向文本和圖像添加更多的樣式效果。

h1
{
width:100%;
filter:glow;
}

注釋：若需要使用 filter 屬性，請始終指定元素的寬度。

上面的例子產(chǎn)生下面的輸出：

Header

不同的濾鏡

注釋：除非 background-color 屬性被設(shè)置為 transparent，否則某些 Filter 屬性將無法工作！

filter:alpha(
opacity=20,
finishopacity=100,
style=1,
startx=0, 
starty=0,
finishx=140,
finishy=270)

filter:blur(
add=true,
direction=90,
strength=6);

filter:chroma(
color=#ff0000)

filter:glow(
color=#ff0000,
strength=5);

filter:mask(
color=#ff0000);

filter:shadow
(color=#ff0000,
direction=90);

filter:dropshadow
(color=#ff0000,
offx=5,
offy=5,
positive=true);

filter:wave(
add=true,
freq=1,
lightstrength=3,
phase=0,
strength=5)

Background

background 屬性允許您選用自己的背景。

background-attachment:scroll

背景隨頁面滾動。

background-attachment:fixed

背景不會隨頁面滾動。

• DHTML 簡介
• DHTML DOM