在CSS中,让整个页面居中是非常实用的技巧之一。以下有几种方法可以达到此目的。/*方法一:尝试使用margin属性*/ body { margin: 0 auto; /*将页面在水平方向上居中*/ }
在CSS中,让整个页面居中是非常实用的技巧之一。以下有几种方法可以达到此目的。
/*方法一:尝试使用margin属性*/ body { margin: 0 auto; /*将页面在水平方向上居中*/ } /*方法二:使用flexbox*/ html, body { height: 100%; } body { display: flex; justify-content: center; align-items: center; } /*方法三:使用text-align*/ body { text-align: center; } /*方法四:使用绝对定位*/ html, body { height: 100%; } body { position: relative; } .centered { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /*方法五:使用grid*/ body { display: grid; place-items: center; }
这些是在CSS中让整个页面居中的一些技巧。你可以根据自己的项目选择适合的方法并进行调整。希望这篇文章对你有所帮助。
粉丝
0
关注
0
收藏
0