开发者社区> 落雨_> 正文

div css水平垂直居中

简介: body { padding: 0; margin: 0; } /*垂直居中*/ .box { width: 1200px; /*图片宽*/ height:...
+关注继续查看
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <style>
    body {
        padding: 0;
        margin: 0;
    }
    
    /*垂直居中*/
    .box {
        width: 1200px; /*图片宽*/
        height: 650px; /*图片高*/
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -600px;/* 宽/2 */
        margin-top: -325px; /* 高/2 */
    }
    </style>
</head>

<body>
    <div class="box">
        <img src="img/luomu_02_02.png" /> 
    </div>
</body>

</html>

@落雨
http://ae6623.cn

效果:

img_ba7b0dead06e41967a20b35dde817789.jpg

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
css+div 今日总结
网页布局常用的布局是顶部(top)、底部(footer)、中间部分(center)。顶部一般是标题(title)和菜单(menu),菜单一级菜单和二级菜单,二级菜单的样式方面有多中变化,一般体现在鼠标悬浮,鼠标点击时的字体颜色的更改和局部背景颜色的更改
36 0
CSS样式(三) - div盒子
CSS样式(三) - div盒子
34 0
零基础学网页开发入门(制作博客案例)适应手机端div+css+js的综合介绍
零基础学网页开发入门(制作博客案例)适应手机端div+css+js的综合介绍
43 0
实验:CSS+Div基础 - 预习报告
网页设计技术实验预习报告。
30 0
Web开发及人机交互导论 实验三 CSS+DIV基础
Web开发及人机交互导论 实验三 CSS+DIV基础
48 0
【牛刀小试】——浅析DIV+CSS
【牛刀小试】——浅析DIV+CSS
32 0
给我一个 div + 三行 css,还你一个超级马里奥
要绘制马里奥,我们需要照着图,将图进行格子化,然后一个格子一个格子的绘制。。。。 那是不可能的! 作为一个程序员,这么多色块都要手动绘制,开玩笑,这不是折磨人吗。
110 0
Html之 DIV+CSS布局
Html之 DIV+CSS布局
54 0
html+css实战107-新闻列表-div布局
html+css实战107-新闻列表-div布局
46 0
+关注
落雨_
http://js-dev.cn
文章
问答
文章排行榜
最热
最新
相关电子书
更多
零基础CSS入门教程
立即下载
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载