CSS的12中水平垂直居中方法

---

一、水平垂直居中的12种方法

1.absolute + 负margin

2. absolute + margin:auto

3.absolute + calc

4.absolute + translate

5. flex + justify-content + align-items

6.flex + margin auto

7. 网格布局：grid

8.行内块元素 + line-height

	
	
	   

		   
666666
	   
	

9.行内块元素 + ::after 伪元素选择器

10.行内块元素 + css-table

11. 行内块元素 + table

12.行内块元素 + writing-mode

		* {
			margin: 0;
			padding: 0;
		}

		#div1 {
			height: 100vh;
			width: 100vw;
			text-align: center;
			writing-mode: vertical-lr;
			text-align: center;
		}
        #div2{
			display: inline-block;
			width: 100%;
			writing-mode: horizontal-tb;
			text-align: center;
		}
		#div3 {
			width: 300px;
			height: 300px;
			display: inline-block;
			background-color: aqua;
			margin: auto;
		}