在CSS中，我們可以使用不同的方法來顯示圖片。以下是一些經常使用的CSS模式：

/* 使用img標簽 */
img{
display: block;
width: 100%;
height: auto;
}
/* 使用background-image */
div{
background-image: url("image.jpg");
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 500px;
}
/* 使用::before和::after偽元素 */
div::before{
content: "";
display: block;
background-image: url("image.jpg");
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 500px;
}
/* 使用object-fit屬性 */
img{
object-fit: cover;
width: 100%;
height: 500px;
}

第一種方法是直接在HTML文件中插入img標簽，并使用CSS對它進行樣式化。通過設置display:block和width:100%，使得圖片能夠占據整個父元素的寬度，并且自適應高度。

第二種方法是將圖片作為背景圖片使用。通過設置background-image，可以將圖片顯示在div中。background-repeat:no-repeat保證圖片不會重復出現。background-size:cover則是讓圖片完全占據父元素的面積。

第三種方法是使用偽元素::before和::after，并設置其content屬性為空字符串。這種方式相當于在div中添加了一個額外的層，將背景圖片放在這個層中，達到和前一種方法相同的效果。

第四種方法是使用object-fit屬性。這個屬性可以將圖片的尺寸按照父元素的大小進行縮放。cover則表示盡可能擴大圖片大小，保證圖片完全填充整個父元素。