小編給大家分享一下CSS如何讓圖片在文章內(nèi)容中自動(dòng)居中，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

我們提供的服務(wù)有：成都網(wǎng)站制作、成都網(wǎng)站建設(shè)、微信公眾號(hào)開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、雙流ssl等。為上千多家企事業(yè)單位解決了網(wǎng)站和推廣的問(wèn)題。提供周到的售前咨詢和貼心的售后服務(wù)，是有科學(xué)管理、有技術(shù)的雙流網(wǎng)站制作公司

 首先要調(diào)整的，是讓圖片獨(dú)占一行空間。

補(bǔ)充CSS知識(shí)點(diǎn)：

圖像（<img>標(biāo)簽）默認(rèn)是行內(nèi)樣式（inline   style），行內(nèi)樣式的大體意思是，它前邊或后邊的HTML標(biāo)簽元素會(huì)緊挨著排在它的前后（如影隨形），不會(huì)另?yè)Q一行;而像DIV標(biāo)簽則默認(rèn)是塊級(jí)元素，塊級(jí)元素前后的標(biāo)簽元素會(huì)換行。因此需要把文章內(nèi)容中的圖片樣式由行內(nèi)樣式更換為block塊級(jí)元素，要不就易和文字內(nèi)容糾纏在一起。

簡(jiǎn)單點(diǎn)：

• block元素將顯示為塊級(jí)元素，此元素前后會(huì)帶有換行符。

• inline默認(rèn)。元素會(huì)被顯示為內(nèi)聯(lián)元素，元素前后沒(méi)有換行符。

在原有的控制圖像的樣式中增加：display: block。

.entry img {

max-width: 100%;

height: auto;

display: block;

}

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

實(shí)例：

.entry img {

max-width: 100%;

height: auto;

display: block;

margin:0 auto;

}

經(jīng)以上設(shè)置后，圖像已能自動(dòng)在文章內(nèi)容中居中。但在實(shí)踐中，發(fā)現(xiàn)一些舊的網(wǎng)頁(yè)文章，在發(fā)布時(shí)其圖像有行內(nèi)樣式，如：<img   style=”margin:0;”>這樣的。由于行內(nèi)樣式的優(yōu)先（層疊）級(jí)別高于外部樣式表中的圖像自動(dòng)居中的定義，因此剛才定義的：margin:0  auto就失效了。

這也不是問(wèn)題，給這個(gè)居中用!important指定為最優(yōu)先級(jí)別。最樣使用的樣式如下。

.entry img {

max-width: 100%;

height: auto;

display: block;

margin: 0 auto !important;

}

以上是“CSS如何讓圖片在文章內(nèi)容中自動(dòng)居中”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

新聞標(biāo)題：CSS如何讓圖片在文章內(nèi)容中自動(dòng)居中
網(wǎng)頁(yè)地址：http://jinyejixie.com/article20/ggiojo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站建設(shè)、云服務(wù)器、、關(guān)鍵詞優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)