css中的三種基本定位機(jī)制
發(fā)布時(shí)間：2017-02-24 16:15:57 作者：.smile 
我要評(píng)論
我要評(píng)論本文主要介紹css中的三種基本定位機(jī)制，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
css中的三種基本定位機(jī)制
a.普通文檔流
b.定位：相對(duì)定位
絕對(duì)定位
固定定位
c.浮動(dòng)
1.普通流中，元素位置由文檔順序和元素性質(zhì)決定，塊級(jí)元素從上到下依次排列，框之間的垂直距離由框的垂直margin值計(jì)算得到，行內(nèi)元素在一行中水平布置
2.相對(duì)定位看作普通流的一部分，移動(dòng)后的元素仍占據(jù)原來(lái)的位置，移動(dòng)元素會(huì)導(dǎo)致他覆蓋其他的框
3.絕對(duì)定位相對(duì)于已定位的最近的祖先元素，絕對(duì)定位脫離普通流
4.固定定位是相對(duì)于瀏覽器窗口的定位
5.浮動(dòng)的元素可以左右移動(dòng)，直到他的外邊框邊緣碰到包含自己的框或者另一個(gè)浮動(dòng)框的邊緣
6.浮動(dòng)的元素脫離普通文檔流
7.行內(nèi)元素和行內(nèi)塊元素會(huì)圍繞浮動(dòng)框排列，塊元素會(huì)被覆蓋
以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了CSS屬性之定位屬性（圖文詳解）的相關(guān)資料，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-01-17
css絕對(duì)定位如何在不同分辨率下的電腦正常顯示定位位置？(一定要看！)
這篇文章主要介紹了css絕對(duì)定位如何在不同分辨率下的電腦正常顯示定位位置，本文首先解釋了常見(jiàn)的電腦分辨率，為了頁(yè)面在不同的分辨率下正常顯示，要給頁(yè)面一個(gè)安全寬度，2017-08-18
CSS position屬性和實(shí)例應(yīng)用演示
這篇文章主要介紹了CSS position屬性和實(shí)例應(yīng)用演示,absolute（絕對(duì)定位）,relative（相對(duì)定位）,relative與absolute的結(jié)合使用以及fixed(固定定位),需要的朋友可以參考下2017-08-11
css position定位屬性_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹元素的Position屬性，此屬性可以設(shè)置元素在頁(yè)面的定位方式，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-22CSS的position定位和float浮動(dòng)詳解
本文詳細(xì)介紹了CSS中position定位和float浮動(dòng)的相關(guān)知識(shí)，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-02-24- 下面小編就為大家?guī)?lái)一篇CSS 定位之position全面了解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-07-08
- 這篇文章主要為大家詳細(xì)介紹了CSS3定位和浮動(dòng)的概念，以及實(shí)例代碼講解CSS3定位和浮動(dòng)的使用方法，感興趣的小伙伴們可以參考一下2016-05-10
- 下面小編就為大家?guī)?lái)一篇深入理解CSS定位與層疊。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考2016-04-15
- 這篇文章主要介紹了CSS定位的教程,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-01-30
