如何探究DIV定位單元的控制三大元素用法

如何探究DIV定位單元的控制三大元素用法，相信很多沒(méi)有經(jīng)驗(yàn)的人對(duì)此束手無(wú)策，為此本文總結(jié)了問(wèn)題出現(xiàn)的原因和解決方法，通過(guò)這篇文章希望你能解決這個(gè)問(wèn)題。

和大家重點(diǎn)討論一下DIV定位單元的控制，除了控制定位單元的左上角位置，你還可以控制單元的寬度和高度，及單元在頁(yè)面的可視性等內(nèi)容。

DIV定位單元的控制

（width、height、visiblility）
除了控制定位單元的左上角位置，你還可以控制單元的寬度和高度，及單元在頁(yè)面的可視性。

DIV定位單元的寬度：

定位了的要素在頁(yè)面上顯示時(shí)仍然會(huì)從左到右一直顯示。利用寬度屬性就可以設(shè)定字符向右流動(dòng)的限制，即設(shè)定要素的寬度。
DIV{position:absolute;left:200px;top:40px;width:150px}
瀏覽器接到這項(xiàng)規(guī)則時(shí)，它將文字按照規(guī)則規(guī)定的效果顯示，還將段落的***水平尺寸限制在150象素。
寬度屬性只適用于絕對(duì)定位的要素。你可以使用我們學(xué)過(guò)的任何一種長(zhǎng)度單位，或使用比例值設(shè)定寬度，比例值指相對(duì)于母體要素的比例。IE4中，這項(xiàng)屬性還可用于圖像。你可以通過(guò)寬度設(shè)置人為地拉寬或壓縮圖像。

DIV定位單元的高度：

理論上講，高度應(yīng)該和寬度的設(shè)置類似，只不過(guò)是在垂直方向上：
DIV{position:absolute;left:200px;top:40px;height:150px}
這里我用了“理論上講”，因?yàn)橛行g覽器不支持高度屬性。

DIV定位單元的可視性：

利用CSS，你可以隱藏要素，使其在頁(yè)面上看不見(jiàn)。這條屬性對(duì)于定位了的和未定位的要素都適用。
H4{visibility:hidden}

選項(xiàng)：

visible使要素可以被看見(jiàn)
hidden使要素被隱藏
inherit指它將繼承母體要素的可視性設(shè)置。
值inherit為缺省值。這使單元繼承父單元的可見(jiàn)性。所以，如果某一段是隱藏的，則它包含的任何行間單元也都被隱藏。這一繼承性可被明確指定的可見(jiàn)性取代。例如，段內(nèi)的EM單元被指定為可見(jiàn)，這時(shí)如果該段被隱藏，則段內(nèi)的所有其它內(nèi)容都將消失，而唯有EM單元中的文本是可見(jiàn)的。

當(dāng)一個(gè)要素被隱藏后，它仍然要占據(jù)瀏覽器窗口中的原有空間。所以，如果你將文字包圍在一幅被隱藏的圖像周?chē)敲?，其顯示效果將是文字包圍著一塊空白區(qū)域。
這條屬性在編寫(xiě)語(yǔ)言和使用動(dòng)態(tài)HTML時(shí)很有用，比如你可以使某段落或圖像只在鼠標(biāo)滑過(guò)時(shí)才顯示。

看完上述內(nèi)容，你們掌握如何探究DIV定位單元的控制三大元素用法的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！