是一個塊級元素,也就是說,瀏覽器通常會在div元素前后放置一個換行符。
編程中DIV的浮動、定位、和框架模型簡介CSS中有3種基本的定位機(jī)制,即普通流、浮動和絕對定位。除非專門指定,否則所有框都會在普通流中定位。在可視化模型中浮動、定位和框架模型是CSS的3個最重要的概念,這些概念控制著編輯人員在頁面上安排和顯示元素的方式,形成CSS的基本布局。
可以使用display屬性改變生成的框的類型,通過將display屬性設(shè)t為block,可以讓行內(nèi)元素表現(xiàn)像塊級元素一樣。還可以將display屬性設(shè)none.讓生成的元素根本沒有框。這樣這個框及其所有內(nèi)容就不顯示了,不占用文檔中的空間。
塊級框從上到下一個接一個地排列,框之間的垂宜距離由框的垂直空白邊計(jì)算出來行內(nèi)框在一行中的水平位置,可以使用水平填充、邊框和空白邊設(shè)置,它們之間的水平間距。但是垂直填充、邊框和空白邊不影響行內(nèi)框的高度。
由于一行形成的水平框稱為行框,行框的高度足以容納它包含的所有行內(nèi)框,設(shè)置行高可以增加這個框的高度??蚩梢园凑誜HTM的嵌套方式包含其他的框。大多數(shù)框由顯示定義的元案形成。但有時即使沒有進(jìn)行顯示定義,也會創(chuàng)建塊級元素。這種情況發(fā)生在將一些文本添加到一些塊級元素的開頭時,即使沒有把這些文本定義為段落,它也會被認(rèn)為是段落。
在這種情況下,這個框?yàn)闊o名塊框,因?yàn)樗慌c專門定義的元素相關(guān)聯(lián)。塊級元素內(nèi)的文本行也會發(fā)生類似的情況。假設(shè)有一個包含3行文本的段落,每行文本形成一個無名行框.則無法直核對無名框或行框應(yīng)用樣式,因?yàn)闆]有可以應(yīng)用樣式的地方。但是。這有助于理解在屏幕上看到的所有東西都形成某種框。
浮動定位:一種定位模型為浮動模型浮動的框可以左右移動,直到它外邊緣碰到包含框或另一個浮動框的邊緣。因?yàn)楦痈辉谖臋n的普通流中,所以文檔流中的塊框表現(xiàn)得就像浮動框不存在一樣。
float可選參數(shù)有以下幾個:1、inherit:繼承父級元素的浮動屬性,
2、Lift:元素會移至父元素中的左側(cè),
3、none:默認(rèn)值,
4、right:元素會移至父元素中的右側(cè)。
position定位:position定位與float一樣也是CSS排版中非常里要的概念Position的字面意思是指定塊的位置,即塊相對子其父塊的位置和相對于它自身應(yīng)該在的位置。
position屬性值有以下幾種:1、absolute:絕對,將對象從文檔流中拖出.通過width、height、left right、toP、bottom等屬性與margin,padding、border進(jìn)行絕對定位,絕對定位的元素可以有邊界,但這些邊界不壓縮。而其層疊通過z-index屬性定義。
2、Fixed:懸浮,使元素固定在屏幕的某個位置,其包含塊是可視區(qū)域本身.因此它不隨滾動條的滾動而滾動。
3、Inhert:繼承上級元素position值。
4、relative:相對,對象不可層疊但將依據(jù)left, right、top, bottom等屬性在正常文檔流中偏移位置。
5、static:靜態(tài)(默認(rèn)),無特殊定位。