Rumah > hujung hadapan web > html tutorial > 网页居中问题_html/css_WEB-ITnose

网页居中问题_html/css_WEB-ITnose

WBOY
Lepaskan: 2016-06-24 11:56:25
asal
1241 orang telah melayarinya

各位前辈,
我想让网页的主div居中,让后在网上查了一下说是使用margin:0 auto;的方法让主div居中让后在在里面添加其他的div,但是当我对后添加的div使用绝对定位时网页不能正常显示,我想请问一下如果我打算对网页中的div都是用绝对定位的方式(这是方式简单粗暴),我应该怎样使网页在浏览器中居中。
结构大概简要为如下方案。
//怎样使这个div居中而下面的次div在这个div内绝对定位。


...


非常感谢。

顺便问一下通常情况的网页居中使用的是什么方法。
是不是在存在父子关系的div中不允许使用混合的定位方法。


回复讨论(解决方案)

当前页面就是div居中的,你f12看下css

主div给个width宽度之后,使用margin:0 auto来实现主div在页面居中。次div如果要相对主div position:absolute绝对定位的话,那么主div需要position:relative相对定位。

给主div一个宽度width:**px;,然后加上margin:0 auto;这个属性,主div就可以居中了。
如果子div使用定位需要给父级div加上position:relevant; 然后子定义position:absolute;再配合top,right,left,bottom进行定位。


    

        里面的内容会离居中那个盒子上10像素,左10像素。
    

你DIV如果没有宽度 是居中不了的 你用margin:auto; 这只能水平居中 想要全局居中 你可以用绝对定位position:absolute来实现。另外还有的实现方法就是用JS来实现。获取浏览器的高度 然后减去DIV的高度 之后除以2就可以了。

1、主div指定宽度,并margin: 0 auto;
2、次div用float: left;position: relative; 进行布局
3、次div不要用position: absolute; 布局

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan