CSS是一種非常強(qiáng)大的Web語言，它不僅可以為網(wǎng)站添加樣式和布局，還可以實(shí)現(xiàn)許多非常炫酷的效果。其中，CSS如何顯示圖片是一個(gè)非常重要的問題，不同的CSS圖片顯示方式可以讓我們實(shí)現(xiàn)不同的效果。

下面我們來介紹一下常見的CSS圖片顯示方式。

/* 1.inline-block顯示方式 */
 img {
display: inline-block;
 }
/* 2.float顯示方式 */
 img {
float: left;
 }
/* 3.position顯示方式 */
 img {
position: absolute;
top: 0;
left: 0;
 }
/* 4.background-image顯示方式 */
 .bg-image {
background-image: url("images/bg.jpg");
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
 }

這四種CSS圖片顯示方式分別適用于不同的情況。

第一種inline-block顯示方式適用于需要讓圖片和其他內(nèi)聯(lián)元素在同一行顯示的情況，比如圖片和文字排版。

第二種float顯示方式適用于需要讓圖片環(huán)繞在文本周圍的情況，比如文字環(huán)繞圖片的效果。

第三種position顯示方式適用于需要在頁面中精確定位圖片的情況，比如絕對(duì)定位。

第四種background-image顯示方式適用于需要在元素背景上顯示圖片的情況，比如網(wǎng)頁背景圖。

總之，通過不同的CSS圖片顯示方式，我們可以實(shí)現(xiàn)各種各樣的網(wǎng)站效果，為網(wǎng)站帶來更加豐富的內(nèi)容和視覺體驗(yàn)。