div中的文字和圖片水平居中的方法
阿新 • • 發佈：2019-01-09
css文字水平居中的案例1：
.page{text-align: center;}
<div class="page"><p>這是需要水平居中的文字</p></div>css文字水平居中的案例2：
.page{display: flex;justify-content: center;}
<div class="page"><p>這是需要水平居中的文字</p></div>css圖片水平居中的案例1：
<div class="tu" align="center"><img src="img/1.jpg"></div>
css圖片水平居中的案例2：
.tu img{display: block;margin:0 auto;}
<div class="tu"><img src="img/1.jpg" ></div>.tu{display: flex;justify-content: center;}
<div class="tu"><img src="img/1.jpg" ></div>.tu img{width: 100px;height: 100px;position: relative;left: 50%;margin-left: -50px;} <div class="tu"><img src="img/1.jpg" ></div>
css圖片水平居中的案例5：
.tu{text-align: center;}
<div class="tu"><img src="img/1.jpg" ></div>