如何居中p 如何居中一个浮动元素如何让绝对定位的p居中? - 好学星城学习论坛

page contents

轩辕小不懂发布于 2021-12-07 15:37

阅读 482

收藏 0

答案 1

分类：WEB前端开发

CSS

2589

小柒 2021-12-07 15:49

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>Document</title>

<style>

* {

margin: 0;

padding: 0;

}

html,

body {

width: 100%;

height: 100%;

}

.outer {

width: 400px;

height: 100%;

background: blue;

margin: 0 auto;

display: flex;

align-items: center;

}

.inner {

position: relative;

width: 100%;

height: 0;

padding-bottom: 50%;

background: red;

}

.box {

position: absolute;

width: 100%;

height: 100%;

display: flex;

justify-content: center;

align-items: center;

}

</style>

</head>

<body>

<div class="outer">

<div class="inner">

<div class="box">hello</div>

</div>

</div>

</body

评论 (0)

1 关注

提出于 2021-12-07 15:37

全部

482 阅读

482 阅读

482 阅读

482 阅读

482 阅读

482 阅读