問題:
用戶試圖創建一個按鈕與視口保持固定的垂直距離,同時與div的右邊緣保持特定距離,無論視口如何
解決方案:
水平定位:
水平定位:雖然「絕對絕對水平」定位在技術上無法透過所提供的實現解決方案,就可以達到與div右邊緣保持固定距離的目的。透過避免為水平固定元素設定 left 或 right 屬性,容器 div 用於控制其水平位置。
垂直定位:元素被定位使用position:fixed屬性垂直固定。透過設定頂部值,無論視口大小如何,都會保持垂直定位。
程式碼範例:<body> <div class="inflow"> <div class="positioner"> <div class="fixed"></div> </div> </div> </body>
div.inflow { width: 200px; height: 1000px; border: 1px solid blue; float: right; position: relative; margin-right: 100px; } div.positioner {position: absolute; right: 0;} div.fixed { width: 80px; border: 1px solid red; height: 100px; position: fixed; top: 60px; margin-left: 15px; }
CSS:
以上是如何相對於 div 垂直固定和水平定位元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!