圖像img標(biāo)簽?zāi)J(rèn)是行內(nèi)樣式，不會(huì)換行。如果要實(shí)現(xiàn)正文中的圖片獨(dú)占一行并自動(dòng)居中對(duì)齊，就需要把文章內(nèi)容中的圖片樣式由行內(nèi)樣式更換為block塊級(jí)元素。

1、更換為塊級(jí)元素

我們可以在原有的控制圖像的樣式中增加：display: block。block元素將顯示為塊級(jí)元素，此元素前后會(huì)帶有換行符。

CSS實(shí)例：

.content img {

display: block;

}

2、設(shè)置圖片居中對(duì)齊

居中用的同樣是網(wǎng)頁(yè)布局時(shí)整體居中的代碼，即margin:0 auto，0可以改為任何數(shù)據(jù)，像素或EM（控制的是上下距離）；重要的是AUTO屬性，因?yàn)樗刂圃刈笥业木嚯x，AUTO則是用于居中的屬性。

CSS實(shí)例：

.content img {

margin:0 auto;

}

通過(guò)CSS實(shí)現(xiàn)讓正文中的圖片獨(dú)占一行并自動(dòng)居中對(duì)齊代碼：

CSS實(shí)例：

.entry img {

max-width: 100%;

height: auto;

display: block;

margin: 0 auto !important;

}

經(jīng)以上設(shè)置后，圖像已能自動(dòng)在文章內(nèi)容中居中。但在實(shí)踐中，如果有些頁(yè)面寫了行內(nèi)樣式，如：<img style=”margin:0;”>由于行內(nèi)樣式的優(yōu)先（層疊）級(jí)別高于外部樣式表中的圖像自動(dòng)居中的定義，因此剛才定義的：margin:0 auto就失效了。這種情況下給這個(gè)居中用!important指定為最優(yōu)先級(jí)別即可。

CSS實(shí)例：

.entry img {

max-width: 100%;

height: auto;

display: block;

margin: 0 auto !important;

}