在css中用auto使div居中对齐

自己一直都这么认为，提升自己的能力，才是在任何地方能立足的基础，这些年一直希望自己在专业上保持进步。又思考一下，在各方面的能力上，其实还欠缺很多，一直在找时间弥补和提升，越来越发现，自己的不足之处越来越多。要充分肯定不够好的自己，不求全方位，只求在个别方面，做的够好。注定人的一生是焦虑的，注定人的一生是忙碌的，注定人的一生有无限种可能，相信任何时候，张开眼，都能看到希望。

感慨发完了，今晚看完演出，回到房间里，刷了一段css视频，视频上讲的是使用auto使div居中对齐，我亲自试了一下。写了一个div，如下：

<div class="div1">醉里挑灯看剑，梦回吹角连营；八百里分麾下炙，五十弦翻塞外声，沙场秋点兵。</div>

在div上加的样式如下：

.div1 {
		width: 200px;
		height: 200px;
		border: black solid 3px;
		background-color: pink;
	}

效果如下图：

我如果加上margin-left: auto;，即代码如下

.div1 {
		width: 200px;
		height: 200px;
		border: black solid 3px;
		background-color: pink;
		margin-left: auto;
	}

则div移向右侧，即右对齐，如下：

我如果加上margin-right: auto;，即代码如下

.div1 {
		width: 200px;
		height: 200px;
		border: black solid 3px;
		background-color: pink;
		margin-right: auto;
	}

则div移向左侧，即左对齐，如下：

那么如何居中对齐呢，同时加上margin-right: auto; 和margin-left: auto;就可以，代码如下：

.div1 {
		width: 200px;
		height: 200px;
		border: black solid 3px;
		background-color: pink;
		margin-right: auto;
		margin-left: auto;
	}

效果如下：