                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

不知道有没有学习的同学一样遇到的问题，不定宽这两节的内容不是很能看懂，而且做出来的效果没有预期的效果，里边说的是div的居中，但是做了之后是文本的居中的，那三个方法也讲的不是很详细

这里的居中都是文本的居中，我加了背景进去

最爱是雪碧_球球

2018-05-21

源自：初识HTML(5)+CSS(3)-升级版 15-6

关注问题我要回答

953

操作

收起

3 回答

主宰灵魂
2018-05-25

1，内容居中就已经达到效果了啊。

2，如要达到楼主要的效果对对div居中，可以把div转换成内联元素(display:inline)，然后再对div的父元素body设置样式居中对齐（text-align:center）即可。但是这样有个缺陷，body内的所有后代元素全都居中对齐了。

3，增加的CSS代码如下：

body{text-align:center;}

.container {

display: inline;

}

0 回复有任何疑惑可以回复我~

收起回答

最爱是雪碧_球球提问者

如果是这样的话，还是用margin:0 auto;达到居中的效果

2018-08-08 回复有任何疑惑可以回复我~

主宰灵魂回复最爱是雪碧_球球提问者

你要分清你是对div自身的居中,还是对div内容的居中.效果有可能相同,但是是两个概念.内容居中是自身相对于父元素的.margin:0 auto;也能达到居中效果,它是通过设置自身相对于父元素的左右外边距相同达到效果的.

2018-08-08 回复有任何疑惑可以回复我~

精慕门3401794
2018-05-24

我也看到了，是内容在div内居中了，不是div在网页里居中了，我自己试了几个别的，发现一个办法就是，给这个块元素外面再设一个块包含住他，然后在外面那个块级元素里直接写块元素转内联元素的转换式，接着写内联元素的居中公式，这样：<div style="dispaly:inline;text-align:center"><p>这里就是要居中的不定宽块级元素</p></div>

0 回复有任何疑惑可以回复我~

收起回答

慕圣608955

你写的这个不设display:inline也能居中

2018-08-14 回复有任何疑惑可以回复我~