html怎么让所有内容居中
h5-任意元素居中 1<!DOCTYPE html>
2<html lang="en">
3<head>
4<meta charset="UTF-8">
5<title>Title</title>
6<style>
7        *{
8            margin: 0;
9            padding: 0;
10        }
11        .box{
12            width: 400px;
13            height: 400px;
14            border-radius: 200px;
15            background-color: #65ffdd;
16            margin: 100px auto;
17            position: relative;
18        }
19        .rec{
20            width: 100px;
21            height: 100px;
22            background-color: #7a67ff;
23            position: absolute;
24/*定位的百分⽐是参照⽗容器的宽⾼*/
25            left: 50%;
26            top: 50%;
27/*使⽤transform实现元素的居中是参考元素本⾝的宽⾼*/
28            transform: translate(-50%,-50%);
29        }
30
31</style>
32</head>
33<body>
34<div class="box">
35<div class="rec"></div>
36</div>
37</body>
38</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。