css 查缺補漏

css 查缺補漏

1. clear

clear屬性指定一個元素是否必須移動 (清除浮動后) 到在它之前的浮動元素下面。clear 屬性適用于浮動和非浮動元素。
①應(yīng)用于非浮動元素:使非浮動元素的邊框外界移動到所有浮動元素外邊界的下方,頂部外邊界折疊。相鄰的浮動元素外邊界不折疊。

②應(yīng)用于浮動元素:它將底部元素的[外邊界邊緣移動到所有相關(guān)的浮動元素外邊界邊緣的下方。這會影響后面浮動元素的布局,因為后面的浮動元素的位置無法高于它之前的元素。

③ 如果一個元素里只有浮動元素,那它的高度會是 0。如果你想要它自適應(yīng)即包含所有浮動元素,那你需要清除它的子元素。一種方法叫做clearfix,即clear一個不浮動的 [::after] [偽元素]。

清除浮動方法.png

BFC機制.png

最好的清除浮動的方法是在父元素的css樣式中添加overflow:hidden;

2. float

float屬性指定一個元素應(yīng)沿其容器的左側(cè)或右側(cè)放置,允許文本和內(nèi)聯(lián)元素環(huán)繞它。該元素從網(wǎng)頁的標(biāo)準流(文檔流)中移除,但是仍然保持部分的流動性(與[絕對定位]相反)。

3. 移除無需列表前面的點

list-style:none; 在列表的父元素添加

4. 樣式計算

CSS權(quán)重疊加計算.png

5. 常見居中

居中.png
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 1,display:imline-block會出現(xiàn)縫隙問題 方法一:去掉出現(xiàn)縫隙元素前端的間隔。也可以這樣寫: 方...
    春木橙云閱讀 439評論 0 0
  • 1. css語法由3部分構(gòu)成:選擇器、屬性和值 2.使用css的優(yōu)勢 內(nèi)容與表現(xiàn)分離,有了css,網(wǎng)頁的內(nèi)容(ht...
    碼農(nóng)小紅依閱讀 255評論 0 0
  • CSS 指層疊樣式表(Cascading Style Sheets),是一種用來為結(jié)構(gòu)化文檔(如 HTML 文檔或...
    神齊閱讀 2,231評論 0 14
  • 1.左右布局:不少于三種方法 圣杯布局和雙飛翼布局解決的問題是一樣的,就是兩邊頂寬,中間自適應(yīng)的三欄布局,中間欄要...
    我的天氣很好啦閱讀 643評論 0 0
  • 1. box-sizing box-sizing屬性主要用來控制元素的盒模型的解析模式。默認值是content-b...
    下下下個路口左轉(zhuǎn)閱讀 211評論 0 0

友情鏈接更多精彩內(nèi)容