在css中對(duì)元素進(jìn)行水平居中是非常簡(jiǎn)單的,然而使元素垂直居中就不是一件簡(jiǎn)單的事情了,多年以來(lái),垂直居中已經(jīng)成為了CSS領(lǐng)域的圣杯,因?yàn)樗菢O其常見(jiàn)的需求,但是在實(shí)踐中卻不是一件簡(jiǎn)單的事情。下面我會(huì)簡(jiǎn)單介紹水平居中,并著重討論垂直居中。
第一部分:水平居中
1.實(shí)現(xiàn)行內(nèi)元素的居中。方法:在行內(nèi)元素外面的塊元素的樣式中添加:text-align:center;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{text-align: center;} img{width: 200px;height: 200px;border: thin solid red;} </style> </head> <body> <div> <img src="pic.png"> </div> </body> </html>
延伸閱讀
學(xué)習(xí)是年輕人改變自己的最好方式