溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

clear在css中怎么用

發(fā)布時間:2022-04-15 15:44:27 來源:億速云 閱讀:113 作者:iii 欄目:web開發(fā)

這篇文章主要介紹“clear在css中怎么用”的相關(guān)知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“clear在css中怎么用”文章能幫助大家解決問題。

在css中,clear屬性用于清除元素的浮動效果,該屬性可指定段落的左側(cè)或右側(cè)浮動元素的效果;默認該屬性的值為none,表示允許浮動元素出現(xiàn)在兩側(cè),也可設(shè)置元素的左側(cè)、右側(cè)或左右兩側(cè)不能有浮動元素,語法為“元素{clear:屬性值;}”。

本教程操作環(huán)境:windows10系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

clear在css中的用法是什么

css中clear的作用是清除元素的浮動效果。

clear屬性指定段落的左側(cè)或右側(cè)不允許浮動的元素。

在 CSS1 和 CSS2 中,這是通過自動為清除元素(即設(shè)置了 clear 屬性的元素)增加上外邊距實現(xiàn)的。在 CSS2.1 中,會在元素上外邊距之上增加清除空間,而外邊距本身并不改變。

不論哪一種改變,最終結(jié)果都一樣,如果聲明為左邊或右邊清除,會使元素的上外邊框邊界剛好在該邊上浮動元素的下外邊距邊界之下。

clear屬性值:

  • eft 在左側(cè)不允許浮動元素。

  • right 在右側(cè)不允許浮動元素。

  • both 在左右兩側(cè)均不允許浮動元素。

  • none 默認值。允許浮動元素出現(xiàn)在兩側(cè)。

  • inherit 規(guī)定應(yīng)該從父元素繼承 clear 屬性的值。

示例如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>123</title> 
<style>
img
{
float:left;
}
p.clear
{
clear:both;
}
</style>
</head>
<body>
<img src="logocss.gif" width="95" height="84" />
<p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
<p class="clear">This is also some text. This is also some text. This is also some text. This is also some text. This is also some text. This is also some text.</p>
</body>
</html>

輸出結(jié)果:

clear在css中怎么用

關(guān)于“clear在css中怎么用”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識,可以關(guān)注億速云行業(yè)資訊頻道,小編每天都會為大家更新不同的知識點。

向AI問一下細節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI