让一个div居于页面正中间

王佳斌

已于 2022-11-05 22:35:36 修改

阅读量4.2k

点赞数

分类专栏： + CSS 文章标签： css 居中页面盒子容器居于页面正中间

于 2020-03-13 13:49:44 首次发布

本文链接：https://blog.csdn.net/weixin_44198965/article/details/104839561

版权

+ CSS 专栏收录该内容

62 篇文章 12 订阅

订阅专栏

在这里插入图片描述

<!DOCTYPE html>   
<html lang="en">   
<head>   
    <meta charset="UTF-8">   
    <title>div居于页面正中间</title>   
    <style type="text/css">   
        *{   
            margin: 0;   
            padding: 0;   
            background-color: #EAEAEA;   
        }   
        div{   
            width: 200px;   
            height: 200px;   
            background-color: #1E90FF;   
        }   
        .center-in-center{   
            position: absolute;   
            top: 50%;   
            left: 50%;   
            -webkit-transform: translate(-50%, -50%);   
            -moz-transform: translate(-50%, -50%);   
            -ms-transform: translate(-50%, -50%);   
            -o-transform: translate(-50%, -50%);   
            transform: translate(-50%, -50%);   
        }   
    </style>   
</head>   
<body>   
    <div class="center-in-center"></div>   
</body>   
</html>

王佳斌

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
8
评论
让一个div居于页面正中间

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>div居于页面正中间</title> <style type="text/css"> *{ ...
复制链接

扫一扫