剛學 CSS的浮動問題

時間 2025-03-17 12:10:02

1樓:網友

你是希望在同一行呢,還是希望不在同一行?

為什麼顯示出來special的div不是跟上乙個div在同一行了。高人解釋一下。

你想和前面的div在同一行,那麼在前面的div也加上浮動。

this is a devision!

this is a devision!

完了以後不要完了清除浮動(如果你不希望下乙個div出現問題)

special上面的div的浮動可以是左或右,如果不新增的話其實也可以浮動。你試試。

this is a devision!

這樣可以實現**混排,即文字圍繞**,不過一定要制定special的寬度和高度,因為div是了塊級元素,預設100%寬。

另外養成**縮排習慣,,你的**很難讀。

2樓:手機使用者

有浮動的,必須清除浮動。加上乙個css樣式放在公用樣式裡面。

clear**如下:

this is a devision!

this is a devision!

this is a devision!

this is a devision!

ddddddd

css浮動佈局

3樓:黑科技

說浮動佈局,就得先知道文件流,文件流有正常文件流脫離文件流

例如01:結果:

分析:對div01設定了左浮動,使div01脫離了文件流,div01是在div02的上中陵蔽面一層,實際的div02還是佔據了一整汪咐行,div02的文字部分看著像被擠出來了,其實這就是文字環繞的實現(文字是英文時有點問題)。

例如02:只設定後面兩個div左浮動。

結果:賣州。

例如03:全部設定左浮動,會從左到右依次排列。(right的相反)注意這裡出現了父元素高度塌陷,height為0

2.浮動帶來的影響。

此外,浮動可以用來實現兩列布局或多列布局。

例如:結果:

css中浮動的原理和規則

4樓:環球4號

浮動都是相對於父層的定位,浮左或者浮右;

一旦使用了浮動,那麼它就不會佔用父層的空間,也就是會出現——父層高2px,內容卻有幾百px(只是舉個例子,具體看情況而定),一般給父層加乙個overflow: hidden就能搞定。

使用浮動一般都是同級元素都會使用浮動,否則很容易出現覆蓋,溢位等情況,這些情況雖然也能通過定位移動解決,但是對於響應式佈局效果並不好,所以浮動一般都是針對——我的同級元素都是浮動的或者只有我乙個。

5樓:前端工程師

css浮動和定位還有盒子模型,寫幾個案例理解就可以的啦,

6樓:趙小刀

float屬性是css中常用的乙個屬性,在實際工作中使用的非常多,如果使用不當就會出現意料之外的效果。

css世界中的float屬性是乙個年代非常久遠的屬性,設定了float屬性的元素會根據設定的屬性值向左或者向右浮動,直到它的外邊緣碰到包含框或另乙個浮動框的邊框為止。設定了float屬性的元素會從普通文件流中脫離,相當於不佔據任何空間,所以文件中普通流中的元素表現的就像浮動元素不存在一樣,因此,設定float屬性的後會影響我們的頁面佈局。具體說來就是:

讓block元素無視float元素,讓inline元素像流水一樣圍繞著float元素實現浮動佈局。

float屬性設計的初衷:僅僅是讓文字像流水一樣環繞浮動元素。

為什麼css浮動沒有效果是怎麼回事呢?

7樓:划船不動漿靠浪

在css中使用float指定浮動屬性值,該屬性的值指出了物件是否及如何浮動,浮動的框可以向左或向右移動,直到它的外邊緣碰到包含框或另乙個浮動框的邊框為止。由於浮動框不在文件的標準流中,所以文件的標準流中的塊框表現得就像浮動框不存在一樣。float的基本語法:

float:none | left | right

1、float取值。

none: 設定物件不浮動,預設值。

left: 設定物件浮在左邊。

right: 設定物件浮在右邊。

2、float的特性。

a)、浮動元素會從標準流中脫離。

b)、浮動元素會觸發bfc(塊級元素格式化)、不影響外邊距摺疊。

c)、 float元素會變成塊標籤。

如果float不是none,當display:inline-table時,display的計算值為table;當display:inline | inline-block | run-in | table-* 系時,display的計算值為block,其它情況為指定值。

float在絕對定位和display為none時不生效: 當display為none時元素會隱藏,所以float意義不大;當position為absolute絕對定位時元素也將從標準流中脫離,元素使用偏移量移動,float特性無效。

浮動元素間會堆疊: 浮動的框可以向左或向右移動,直到它的外邊緣碰到包含框或另乙個浮動框的邊框為止。

浮動元素不能溢位包含塊: 浮動元素在包含塊內,當包含塊的寬度不足以容下浮動的子元素時,將自動折行;垂直方向當包含塊認為浮動的子元素沒有高度時,子元素會溢位,bfc能解決該問題。水平方向不會溢位,垂直方向有可能會溢位。

清除浮動。該屬性的值指出了不允許有浮動物件的邊。

clear:none | left | right | both

適用於:塊級元素。

取值:none: 允許兩邊都可以有浮動物件。

both: 不允許有浮動物件。

left: 不允許左邊有浮動物件。

right: 不允許右邊有浮動物件。

8樓:今天你美嗎

有可能是瀏覽器不相容,換用谷歌瀏覽器試試,不行的話就把你的**貼上,我給你看一下怎麼回事。

9樓:雲一哥

把你**貼上,我看看。

css浮動的css浮動

10樓:瑩兒

浮動的框可以向左或向右移動,直到它的外邊緣碰到包含框或另乙個浮動框的邊框為止。

由於浮動框不在文件的普通流中,所以文件的普通流中的塊框表現得就像浮動框不存在一樣。

請看下圖,當把框 1 向右浮動時,它脫離文件流並且向右移動,直到它的右邊緣碰到包含框的右邊緣:

再請看下圖,當框 1 向左浮動時,它脫離文件流並且向左移動,直到它的左邊緣碰到包含框的左邊緣。因為它不再處於文件流中,所以它不佔據空間,實際上覆蓋住了框 2,使框 2 從檢視中消失。

如果把所有三個框都向左移動,那麼框 1 向左浮動直到碰到包含框,另外兩個框向左浮動直到碰到前乙個浮動框。

如下圖所示,如果包含框太窄,無法容納水平排列的三個浮動元素,那麼其它浮動塊向下移動,直到有足夠的空間。如果浮動元素的高度不同,那麼當它們向下移動時可能被其它浮動元素「卡住」:

css之 浮動問題

11樓:網友

3中的解釋當然是錯誤的了。

這句中說的是絕對定位中元素排列位置的方式。

2、假如浮動元素在非浮動塊元素之前,則非浮動鍵老塊元素內容將會顯示浮動塊元素行後。

簡單臘亮跡的就是說,非浮動元素會繞著浮動元素,這也是實現環繞效果的基本。

3、在浮動元素之後的非浮動塊元素會無視輪並該浮動元素的存在(怎麼可能會無視浮動元素的存在呢?),顯示在與浮動元素開始的位置,浮動元素顯示在非浮動塊元素之上(因為沒有無視,所以非浮動元素不會顯示在浮動元素的開始位置)。

這句換成:3、在 絕對定位 元素之後的 非定位 元素會無視該 絕對定位 元素的存在,顯示在與 絕對定位 元素開始的位置, 絕對定位 元素顯示在 非定位 元素之上。

以上……就是這樣。

html/css的幾個基礎的問題,關於浮動這塊,謝謝!

12樓:網友

定位一般是相對定位,定位只是一種方式,有絕對和相對定位,相對用的多。浮動只是針對塊的排布而已。

是的,必須設定float left才可以左右排開,至於塊高度統一設為200px。寬度可以用百分比,最後乙個塊不一定要right,實際上畫素控制的好left足矣。如果對於希望寬度自適應,並且保持佈局不會亂套,還是用百分比寬度。

4個div的父塊長度使用100%,高度不設,然後4個div分別設定寬度高度,就可以實現了。

關於css浮動的小問題,回答對的而且是認真具體回答的還加分!

13樓:

問題1:如果對#b設定浮動,只有。

會發生改變。

解釋:通過使用id選擇器引用的css樣式,不論如何設定css樣式,它都只對id相同的產生影響,對其他的不產生任何影響。當然,如果希望其他和。

具有相同的樣式,只要將其令其id="b"就行了。

問題2:對#b #c #d都設定了浮動不會影響到#e,此時不需要設定消除浮動。

解釋:#b #c #d和#e不是處在同一層次上的,對他們設定的浮動不會影響到#e,如果是對#a設定了浮動,結果會影響到#e。

如果您是初學者,最好能給層設定好相應的高度和寬度,以避免層和層之間發生重疊,這樣更利於您對浮動的理解。另外,編碼的時候最好注意下**的縮排。如果還是不明白可以繼續問我。

14樓:狠心拒絕

1:只有b是浮動的,因為浮動層沒有高度,會出現b和c重疊,需要清除浮動。

2:不會作用到e,但因為沒有高度,此時a的高度不會隨著浮動層b c d而自動調節高度。所有會出現e和a重疊,需要在a的。

前面加個清除浮動。

15樓:熱烈且銳利灬比目魚

問題1 就是id="b"框浮動。

問題2 b、c、d設定浮動不會作用到e 如果 a框下面有乙個f 框 這時候要 消除浮動。

CSS問題的問題,CSS和Js的問題

是說網頁的內容距離頂部10px 左右下都是沒有縫隙的。具體的建議樓主在網上查一查margin和padding屬性吧。祝樓主好運!margin 10px 0 0 0 整個頁面 上面空 10象素 其他都是靠邊。padding 0 0 0 0 內邊都為0 沒效果。這個 可以直接寫為。body margin...

css的問題,CSS和Js的問題

第一句 表示。pagepdevide a原始狀態 滑鼠經過之前的狀態 即 內間距 padding 上面是0,右面是2畫素,下面是0,左邊是2畫素。文字修飾 text decoration 無。背景色 background color 為白色。邊線為1畫素的實線,顏色是 62b5df。字型色 一般co...

關於CSS的問題。CSS的問題 請教了。。。

我總結一下吧,首先用css的hover寫的特效,在firefox等瀏覽器中是不相容的。js for i 1 i 4 i 這個指id迴圈的次數,比如你有6個圖這裡i就改成6迴圈。冬天裡羊羔香。冬天裡羊羔香羊羔香。冬天裡羊羔香。冬天裡羊羔香羊羔香。冬天裡羊羔香。冬天裡羊羔香羊羔香。冬天裡羊羔香。冬天裡羊...