css控制定位的要素

來源:互聯網
上載者:User

核心提示:css除了控制定位要素的左上方位置,你還可以 控制要素的寬度和高度,及要素在頁面的可 視性。

css除了控制定位要素的左上方位置,你還可以 控制要素的寬度和高度,及要素在頁面的可 視性。


寬度

定位了的要素在頁面上顯示時仍然會從左到 右一直顯示。利用寬度屬性就可以設定字元 向右流動的限制,即設定要素的寬度。

DIV { position: absolute; left: 200px; top: 40px; width: 150px }

瀏覽器接到這項規則時,它將文字按照規則 規定的效果顯示,還將段落的最大水平尺寸 限制在150象素。

寬度屬性只適用於絕對位置的要素。你可以 使用我們學過的任何一種長度單位,或使用 比例值設定寬度,比例值指相對於母體要素 的比例。

IE6中,這項屬性還可用於圖象。你可以通 過寬度設定人為地拉寬或壓縮圖象。

高度

理論上講,高度應該和寬度的設定類似,只 不過是在垂直方向上:

DIV { position: absolute; left: 200px; top: 40px; height: 150px }

這裡我用了“理論上講”,因為常用的幾種 瀏覽器都不支援高度屬性。(你最多隻能在 IE 4中用高度設定拉長圖象。)

可視性

利用CSS,你可以隱藏要素,使其在頁面上 看不見。這條屬性對於定位了的和未定位的 要素都適用。

H4 { visibility: hidden }

我很想給你看一個例子,但是,因為要將它 設為看不見,那我這個例子讓你看什麼呢?

選項:

visible使要素可以被看見


hidden使要素被隱藏


inherit指它將繼承母體要素的可視性 設定。


當一個要素被隱藏後,它仍然要佔據瀏覽器 視窗中的原有空間。所以,如果你將文字包 圍在一幅被隱藏的圖象周圍,那麼,其顯示 效果將是文字包圍著一塊空白地區。

這條屬性在編寫語言和使用動態HTML時很有 用,比如你可以使某段落或圖象只在滑鼠滑 過時才顯示。

Communicator不支援可視性屬性。只有IE 4 的使用者可以享受其美妙之處!
 
 



聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.