一、實現(xiàn)居中的三種方式
1. ?絕對定位 +?transform
<div style="width: 100px; height: 100px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: red;"></div>
2. flex 彈性布局居中
<div style="width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center;">?
? ? ? ?<div style="width: 100px; height: 100px;background-color: red;"></div>
?</div>
3.父節(jié)點(diǎn)作物?grid ? ?place-items:center;
<div style="width: 100vw; height: 100vh; display: grid; place-items:center;">
? ? ? ? <div style="width: 100px; height: 100px;background-color: red;"></div>?
?</div>
