欢迎光临
我们一直在努力

如何把DIV模块在页面上居中显示html+css

如何让div模块在页面居中还自适应所有屏幕呢?其实很简单,不需要js控制css代码直接搞定。包括手机屏幕依然可以自动上下左右居中。废话不多说直接上代码教程。这个也可用于广告,或者是弹窗提醒等!

效果

HTML:

<div class="center"></div>

CSS样式:

.center{
width:200px;  //div宽度
height:300px;  //div高度
background:#FA2;  //div背景颜色。
position: fixed; 
left: 50%; 
top: 50%;
z-index: 9999;//z-index的数值是让DIV模块始终在最上端数值越大越再最上方
margin-top: -300px;//这个数值这个DIV高度300px的一半,并添加为负值
margin-left: -100px;//这个数值这个DIV宽度400px的一半,并添加为负值
}

 

赞(0) 打赏
未经允许不得转载:新起点博客 » 如何把DIV模块在页面上居中显示html+css

评论 抢沙发

评论前必须登录!