float和position屬性的區(qū)別和使用方法_Div+CSS教程
float和position屬性的區(qū)別和使用方法?今天找了篇文章,講的比較通俗易懂,供大家參考
postion:relative是子塊級元素面向父級元素的相對定位,定位關鍵字使用left/right/top/bottom。兄弟塊元素之間相對進行定位,但是position移動后,原位置依然保留。而且隨后的兄弟塊元素定位基于被移走前的位置。
float:right/left是子塊級元素流集合面向父級元素的定位,定位的關鍵詞使用margin/padding。兄弟塊元素之間進行相對的定位均基于移動后的新位置進行重新渲染,可以重疊,原位置被清空。
二者之中最大的差別就是位置保留。
人們也就利用這種差異,可以做出CSS代碼的滑動門菜單。
hover時取當前元素為保留位置,定義一個relative時,沒有hover時使用float清空保留位置。
比較示例中的3個樣式表,就可以發(fā)現:
本文來源與模板無憂_m.hl5o.cn 模板無憂_m.hl5o.cn
相關Div+CSS教程:
- 相關鏈接:
- 教程說明:
Div+CSS教程-float和position屬性的區(qū)別和使用方法
。