自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

DIV定位單元中三大元素的控制

開發(fā) 前端
本文向大家介紹一下DIV定位單元的控制,除了控制定位單元的左上角位置,你還可以控制單元的寬度和高度,及單元在頁面的可視性。

你對DIV定位單元的控制方式是否熟悉,這里和大家分享一下,主要包括寬度,高度和可見性三部分內(nèi)容,在沒有介紹之前首先讓我們一起看一下DIV定位的概念。

DIV簡介

DIV在編程中又叫做整除,即只得商的整數(shù)。DIV元素是用來為HTML文檔內(nèi)大塊(block-level)的內(nèi)容提供結(jié)構(gòu)和背景的元素。DIV的起始標(biāo)簽和結(jié)束標(biāo)簽之間的所有內(nèi)容都是用來構(gòu)成這個塊的,其中所包含元素的特性由DIV標(biāo)簽的屬性來控制,或者是通過使用樣式表格式化這個塊來進行控制。

DIV定位單元的控制

 ?。╳idth、height、visiblility)
  除了控制定位單元的左上角位置,你還可以控制單元的寬度和高度,及單元在頁面的可視性。

寬度:

  DIV定位了的要素在頁面上顯示時仍然會從左到右一直顯示。利用寬度屬性就可以設(shè)定字符向右流動的限制,即設(shè)定要素的寬度。
  DIV{position:absolute;left:200px;top:40px;width:150px}

  瀏覽器接到這項規(guī)則時,它將文字按照規(guī)則規(guī)定的效果顯示,還將段落的***水平尺寸限制在150象素。
  寬度屬性只適用于絕對定位的要素。你可以使用我們學(xué)過的任何一種長度單位,或使用比例值設(shè)定寬度,比例值指相對于母體要素的比例。IE4中,這項屬性還可用于圖像。你可以通過寬度設(shè)置人為地拉寬或壓縮圖像。

高度:

  理論上講,高度應(yīng)該和寬度的設(shè)置類似,只不過是在垂直方向上:
  DIV{position:absolute;left:200px;top:40px;height:150px}
  這里我用了“理論上講”,因為有些瀏覽器不支持高度屬性。

可視性:

  利用CSS,你可以隱藏要素,使其在頁面上看不見。這條屬性對于DIV定位了的和未進行DIV定位的要素都適用。
  H4{visibility:hidden}

選項:

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

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

【編輯推薦】

  1. 深入剖析DIV概念和用法
  2. Div+CSS布局入門教程之頁面布局和規(guī)劃
  3. 深入學(xué)習(xí)DIV+CSS之絕對定位和相對定位用法
  4. Div+CSS布局入門之寫入整體層結(jié)構(gòu)與CSS
  5. DIV+CSS開發(fā)過程中影響SEO的制作細(xì)節(jié)
責(zé)任編輯:佚名 來源: hi.baidu.com
相關(guān)推薦

2010-08-26 17:02:35

DIV定位

2010-09-10 09:51:05

DIVCSS

2010-10-08 09:26:45

JavaScript程

2010-09-29 10:33:55

J2MEJVM

2010-09-16 15:24:16

JVM結(jié)構(gòu)

2010-07-01 14:13:51

UML時序圖

2010-07-08 14:24:09

UML數(shù)據(jù)建模

2021-11-08 14:24:33

加密貨幣元宇宙工具

2010-06-30 10:57:49

UML用例圖

2010-03-12 10:21:48

Python函數(shù)

2010-08-12 16:28:51

Flex應(yīng)用程序

2017-11-06 10:07:36

智能自動化管理

2010-09-28 09:49:49

DOM模型

2010-09-14 17:27:12

DIV CSS定位

2010-09-15 13:50:04

CSSposition屬性

2010-07-23 13:07:39

Perl

2010-08-16 15:46:16

DIV居中

2010-08-13 13:39:51

Flex效果組件

2010-09-13 11:25:56

DIV元素

2010-09-07 13:58:28

SPANDIV
點贊
收藏

51CTO技術(shù)棧公眾號