CSS知識 浮動 定位

2021-09-26 03:40:56 字數 637 閱讀 8148

所有的元素預設情況下都是在文件流中存在的

文件流是網頁的最底層

元素在文件流中的特點:

內聯元素

相對定位

相對於元素自身在文件流中的位置進行定位

相對定位的元素不會脫離文件流,定位元素的性質不會改變,塊還是塊,內聯還是內聯

如果不設定偏移量,元素不會發生任何的變化

會提公升元素的層級

絕對定位

相對於離它最近的開啟了定位的祖先元素進行定位,如果祖先元素都沒有開啟定位則相對於瀏覽器視窗進行定位。

絕對定位會使元素完全脫離文件流,會改變元素的性質,內聯變成塊元素,塊元素的寬度被內容撐開

絕對定位的元素如果不設定偏移量,元素的位置不會發生變化

會提公升元素的層級

固定定位

偏移量層級

元素的透明

使用opacity來設定元素的透明度

- 需要乙個0-1之間的值

- 0 表示完全透明

- 1 表示完全不透明

ie8及以下的瀏覽器不支援該樣式,需要使用如下方式來設定

filter:alpha(opacity=透明度);

- 需要乙個0-100之間的值

- 0 表示完全透明

- 100 表示完全不透明

CSS定位 浮動定位

css定位機制 浮動定位 float屬性 進行浮動定位 left,right clear屬性 清除浮動 left,right,both float屬性 1.概述 div實現橫向多列布局 float屬性 left 左浮動 right 右浮動 none 不浮動 下圖為 的實現 float屬性用途 在 混...

css浮動定位

請看下圖,當把框 1 向右浮動時,它脫離文件流並且向右移動,直到它的右邊緣碰到包含框的右邊緣 如果把所有三個框都向左移動,那麼框 1 向左浮動直到碰到包含框,另外兩個框向左浮動直到碰到前乙個浮動框。在 css 中,我們通過 float 屬性實現元素的浮動。浮動框旁邊的行框被縮短,從而給浮動框留出空間...

CSS浮動定位

left 左浮動,左邊沒有任何元素 right 右浮動,右邊沒有任何元素 none 不浮動 清空左右的浮動元素 both 清除左右兩邊的浮動 left和right 只清除乙個方向的浮動 none是預設值 只在需要移除一直盯的清除值時用到 如果乙個元素的子元素都浮動起來,那麼他的父元素的高度自動坍塌到...