模块居中显示问题

模块居中显示问题

在自适应的情况下,margin:0 auto;还能实现居中效果吗?不是只有在确切值的时候才能使用,为什么之前写的时候width:100%然后用margin:0 auto ;无法实现模块居中

正在回答

登陆购买课程后可参与讨论,去登陆

1回答

你好同学,不是说非要设置成固定的值才可以居中,而是当盒子的宽度小于浏览器宽度才会看到居中的效果。所以设置百分比或者px都可以。参考如下:

div默认宽度就是相对浏览器100%显示,所以盒子两头都是紧贴在浏览器的两侧的,再怎么设置居中,也是看不到效果的. 就像在盘子里面放一个西瓜,西瓜已经填满盘子了,不管你怎么摆放,西瓜都是填满盘子的,所以没有什么居中不居中可言。而在盘子里面放一个苹果,苹果要比盘子小的,所以把它放在盘子中间就能直观的看到。

http://img1.sycdn.imooc.com//climg/5d356f770001c4f319200219.jpg

当设置宽度自适应,即百分比的时候。只要小于100%,盒子宽度就比浏览器宽度小。

http://img1.sycdn.imooc.com//climg/5d3571010001504a04050300.jpg

此时就像放一个苹果一样,可以直观的看到居中:

http://img1.sycdn.imooc.com//climg/5d35715800019ff819050184.jpg

祝学习愉快,望采纳。

  • VermouthYan 提问者 #1
    margin: 0 auto;设置居中,在任何情况下都适用吗?现在对于模块居中真的超级晕,都在什么条件下能这样设置模块居中?
    2019-07-22 16:22:24
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师