隨着移動端設計越來越重要,如何在 CSS 布局中垂直居中一直是前端工程師們需要面對的問題。在本文中,我們將深入了解如何有效地對齊 CSS 布局中的元素。
一、使用 Flexbox 實現垂直對齊
CSS3 引入了強大的 Flexbox 布局,它使得對齊元素變得非常簡單。在 Flex 布局中,可以使用 align-items 屬性對子元素進行垂直對齊。
示例代碼如下:
“`
.container {
display: flex;
align-items: center; /* 垂直居中 */
}
元素1
原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-hk/n/201056.html