以下為本站文章分類清單

  1. AJAXspacer
  2. ASPspacer
  3. CSSspacer
  4. Javascriptspacer
  5. Windows 應用程式spacer
  6. 網頁設計
  7. 評論、短文、雜文spacer
  8. 版主spacer
  9. 最新回應spacer

    以下為本頁本文內容

    圖層重疊效果

    這是您期待以久的圖層重疊效果! 在宣告圖層 我們解釋了如何設定您的圖層 的上邊界及左邊界, CSS 位置層級使用 z-index 屬性來讓圖層有上下層之分,正常來說,如果您的多份圖層都在同一位置時, 後來的物件會蓋過先前的物件。但使用 CSS 屬性一覽表 您可以指定某一份圖層在其他圖層之上或之下,或是改變其上下的順序。 (按; SS本身就有重疊的含意,前面所講的都只限於 SS-style sheet 的部份,而且只用來定義樣式體裁,事實上可以定義一個 style sheet 用來 當作是一頁,您要轉不過來,就當作是寫一頁新的網頁就好了,利用 Cascading 的特性, 就是 z-index 屬性 及 visibility 屬性來控制顯示與否與圖層的上下層關係。)

    下面的例子,兩行字幾乎在同一位置,(第二行比第一行低10pixels) 正常來說,第二行文字會壓在第一行文字之上,但是我們設了 z-index

    <HTML>
    <HEAD>
    <STYLE type="text/css">
    <!--
    .over  
           {
           position: absolute;
            top: 165px;
            left: 20px;
            z-index: 2;
            background-color: green
            }

    .under 
            {
            position: absolute;
            top: 175px;
            left: 20px;
            z-index: 1;
            background-color: blue
            }
    -->
    </STYLE>
    </HEAD>

    <BODY>

    <SPAN class="over">這段文字距離視窗左邊 20 點,上邊 165 點</SPAN>  
    <SPAN class="under"> 這段文字則是接在前一段文字之"下"注意到有些字被遮住了, 我們也可以改變讓這段文字壓在前一段文字之上, 技巧在於改變 z-index 的值</SPAN> 
    </BODY> 
    </HTML> 

    上一頁:宣告圖層 下一頁:特殊效果

    以下為文章回應區

    同意轉載,不過麻煩看一下轉載需知

    給個回應
    姓名:
    佈落格網址:
      如果您是要發問問題, 最好有個問題測試的網址, 這樣比較容易找到您問題所在, 謝謝
    內容: