css什麼是浮動-前端問答-PHP中文網

css什麼是浮動

青灯夜游

發布： 2023-01-04 09:34:27

原創

1877 人瀏覽過

在css中，浮動是一種使元素脫離文檔流的方法，會使元素根據float的值向左或向右移動，其周圍的元素也會重新排列，直到它的外邊緣碰到包含框或另一個浮動框的邊框為止。

css什麼是浮動

本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

浮動是一種使元素脫離文件流的方法，會使元素向左或向右移動，其周圍的元素也會重新排列。

浮動的意義：設定了浮動屬性的元素會脫離普通標準流的控制，移動到其父元素中指定的位置的過程，將區塊級元素放在一行，浮動會脫離標準流，不佔位置，會影響標準流，浮動只有左右浮動，不會出現上下浮動。

浮動是一種非常有用的佈局方式，它能夠改變頁面中物件的前後流動順序。這樣做的好處是，使得內容的排版變的簡單，具有良好的伸縮性。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
img 
{
	float:right;
}
</style>
</head>

<body>
<p>在下面的段落中，我们添加了一个 <b>float:right</b> 的图片。导致图片将会浮动在段落的右边。</p>
<p>
<img  src="logocss.gif"    style="max-width:90%"  style="max-width:90%" / alt="css什麼是浮動" >
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
</p>
</body>

</html>

登入後複製

css什麼是浮動