CSS中如何實現全局居中呢?可以采取以下三種方法:
1. 在父級元素上使用flex布局
.parent{ display: flex; justify-content: center; align-items: center; }
使用flex布局,通過設置父級元素的justify-content和align-items屬性為center,即可讓子元素在水平和垂直方向上居中。
2. 在子元素上使用絕對定位
.parent{ position: relative; } .child{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
在父級元素上設置position: relative,然后在子元素上設置position: absolute,然后通過設置top、left和transform屬性來使子元素居中。
3. 使用網格布局
.parent{ display: grid; place-items: center; }
使用網格布局,通過設置父級元素的display屬性為grid,然后設置place-items屬性為center,即可使子元素在水平和垂直方向上居中。
下一篇indes.php