本篇教程介紹了HTML+CSS入門 HTML高度塌陷以及定位詳解，希望閱讀本篇文章以后大家有所收獲，幫助大家HTML+CSS入門。

<

高度塌陷的含義：

父元素的高度，默認(rèn)被子元素?fù)伍_，目前來(lái)講box2多高，box1就多高。此時(shí)如果子元素設(shè)置浮動(dòng)，則會(huì)導(dǎo)致其完全脫離文檔流，子元素脫離文檔流將無(wú)法撐開父元素，?導(dǎo)致父元素的高度丟失，就是我們說的高度塌陷問題。父元素一旦高度塌陷，則它下邊的元素會(huì)向上移動(dòng)，?導(dǎo)致整個(gè)頁(yè)面的布局混亂?。

定位(position)：

定位一共有4種：relative,absolute,fixed,static

relative:相對(duì)定位就是在自己原先的位置上進(jìn)行定位，沒有脫離文檔流，還占著原先的位置，比如設(shè)置position:relative,left:2px;top:2px,這個(gè)意思是在原來(lái)的位置上往左移動(dòng)了2個(gè)px,往后面移動(dòng)了2px

absolute:絕對(duì)定位就是相對(duì)于已經(jīng)定位的兄弟元素或者父元素

fixed:固定定位，相當(dāng)于固定在瀏覽器的某個(gè)位置。

本文由職坐標(biāo)整理發(fā)布，歡迎關(guān)注職坐標(biāo)WEB前端HTML/CSS頻道，獲取更多HTML/CSS知識(shí)！

總結(jié)

以上是生活随笔為你收集整理的css 高度塌陷_HTML+CSS入门 HTML高度塌陷以及定位详解的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。