前端学习（226）:定位使用
生活随笔
收集整理的這篇文章主要介紹了
前端学习（226）:定位使用
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/ html4/strict.dtd">
<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><title>CSS定位</title></head><body><span>藍色的div位于正常文檔流中，紅色的div脫離了文檔里</span><div style="width: 100px;height: 100px;border: 3px solid blue;"></div><div style="width: 100px;height: 100px;border: 3px solid red;position: absolute;top: 50px;left: 50px;"></div><span>這里應該會被紅色div覆蓋的</span><hr /><span>綠色div和粉色div都設置成絕對定位div，但粉色div它的父元素是綠色div，所以粉色div計算相對位置是根據綠色div的原點計算的</span><div style="width: 200px;height: 200px;border: 3px solid green; position: absolute;top: 200px;left: 100px;"><div style="width: 100px;height: 100px;border: 3px solid pink; position: absolute;top: 30px;left: 30px;"></div></div></body>
</html>
運行結果
總結
以上是生活随笔為你收集整理的前端学习（226）:定位使用的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 第六十四期：聊聊原子变量、锁、内存屏障那
- 下一篇： 字母框如何影响UI内容的理解