/* 定位方式左右居中 */
#position{
height: 100px;
background-color: red;
position: relative;
}
#position1{
width: 300px;
height: 100px;
background-color: rgb(176, 204, 206);
position:absolute;
left: 50%;
transform:translateX(-50%);
}<div id="position">
<div id="position1">position方式水平居中</div>
</div>
transform:translateX(-50%);的意思是x轴的偏移量