居中居中

今天想讲一下一直让我头疼的样式居中问题：

在同事的谆谆教导下，学习了两种让样式居中的方法。先说第一种：

1、

display:flex;

align-items: center;

justify-content: center;

看一下效果

效果

html代码

css

2、

position:absolute;

top:50%;

left:50%;

background:red;

transform: translate(-50%,-50%);(或者在一直width和height的情况下，margin:-宽高的一半)

效果

效果图

html

css

用margin

这个讲也不知道该怎么讲，贴出代码，写写看吧。多总结多积累