溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇內容主要講解“Css絕對定位的技巧有哪些”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“Css絕對定位的技巧有哪些”吧!
1.子絕父相
在絕大多數情況下，子元素的絕對定位都是相對于父元素進行定位的，雖然給父元素的position設置relative、absolute、fixed都可以，但是如果不希望父元素脫標，常用解決方案是：
父元素設置position: relative;（讓父元素成為定位元素，又不脫離標準流）；
子元素設置position: absolute;；
2.絕對定位元素的公式應用
絕對定位元素（absolutely positioned element）：position值為absolute或者fixed的元素，因為absolute在沒有找到祖先定位元素時，也是參考視口進行定位的，和fixed的效果一樣。
對于絕對定位的元素，會滿足以下兩個公式：
定位參照對象的寬度 = left + right + margin-left + margin-right + 絕對定位元素實際占用寬度；
定位參照對象的高度 = top + bottom + margin-top + margin-bottom + 絕對定位元素實際占用高度；
如果希望絕對定位元素的寬高和定位參照對象一樣，可以給絕對定位元素設置以下屬性，這也是為什么定位能夠實現盒子的水平垂直居中。
left、right、top、bottom全部設置為0，margin設置為auto；
根據上面公式，margin + 絕對定位元素實際占用寬高 = 定位參照對象的寬高，盒子自然就水平垂直居中顯示了
到此，相信大家對“Css絕對定位的技巧有哪些”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
