CSS居中是指讓元素在父級容器中水平或垂直居中的方法,在頁面布局和美觀設計中十分重要。
/* 居中一個塊級元素 */ .container { display: flex; justify-content: center; /* 水平居中 */ align-items: center; /* 垂直居中 */ } /* 居中一個行內元素 */ .parent { text-align: center; } .child { display: inline-block; } /* 水平居中文本 */ .text-center { text-align: center; } /* 垂直居中文本 */ .parent { height: 200px; display: flex; justify-content: center; align-items: center; }
上面是常見的CSS居中方法,使用前要清楚元素的類型和容器的樣式屬性,可以根據不同需求和場景選擇不同的方法來實現居中。
上一篇css屏幕高度的70%