网页居中问题_html/css_WEB-ITnose

WBOY
풀어 주다: 2016-06-24 11:56:25
원래의
1217명이 탐색했습니다.

各位前辈,
我想让网页的主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; 布局

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿