css浮動產生的負作用

daqianmen發表於2021-09-11
CSS

css浮動產生的負作用

1、背景不能顯示（overflow:hidden）。

由於浮動產生，如果對父級設定了(css background背景)CSS背景顏色或CSS背景圖片，而父級不能被撐開，所以導致CSS背景不能顯示。

2、邊框不能撐開，如果父級設定了CSS邊框屬性，子級裡使用了float屬性產生浮動，父級不能被撐開。

3、margin padding設定值不能正確顯示。

由於浮動導致父級子級之間設定css padding，css margin 屬性的值不能正確表達，特別是上下邊的padding和margin不能正確顯示。

例項

<head>
<style type="text/css">
*{ margin:0; padding:0;}   //取消設定 如 li 留下的那個實點
ul{ width:900px; border:3px dotted red; list-style:none; overflow: hidden;}//overflow:hidden :讓行高自適應
.left{ width:300px; height:300px; background:#FF0; float:left;}   //float:left設定浮動全部向左排
.chent{ width:300px; height:300px; background:#000; float:left}
.right{ width:300px; height:300px; background:red; float:left}
</style>
</head>
<body>
<ul>
<li></li>
         <li></li>
         <li></li>
</ul>
</body>

以上就是css浮動產生的負作用，希望對大家有所幫助。更多css學習指路：

本文轉載於掘金，如有侵犯聯絡作者修改。

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/1727/viewspace-2828035/，如需轉載，請註明出處，否則將追究法律責任。

相關文章