指定Div 尺寸內的內容垂直對齊
以定義的高度和寬度垂直對齊div 中的內容是Web 開發中的常見要求。要實現這種對齊,請考慮以下方法:
1. Parent Div as Table-Cell:
- 將父div 的顯示設為table- cell 並將垂直對齊到中間。
- 此解決方案在瀏覽器中垂直對齊內容支援顯示:表格儲存格。
2.區塊顯示且內容為表格儲存格的父Div:
- 將父div 保留為區塊元素,但將內容的顯示設定為表格儲存格。
- 此方法依賴父 div 保存表格單元格的能力。
3.父div浮動與內容div作為Table-Cell:
- 浮動父div並將內容div的顯示設為table-div cell。
- 這種方式無需修改即可實現對齊父div的顯示屬性。
4.具有相對位置的父級div 和具有絕對位置的內容:
- 相對定位父級div 並絕對設定內容div 。
- 透過設定 top:50 讓內容垂直居中% 和 margin-top:-50% 位於內容 div 上。
- 此方法為特定內容提供了精確但手動的對齊方式場景。
以上是如何在具有定義的高度和寬度的 div 中垂直對齊內容?的詳細內容。更多資訊請關注PHP中文網其他相關文章!