在CSS中,我們可以通過(guò)設(shè)置一些屬性來(lái)使圖片和文字之間產(chǎn)生間隔。
例如,我們可以使用background-image
屬性來(lái)設(shè)置一個(gè)背景圖片。同時(shí),我們需要設(shè)置background-repeat: no-repeat;
來(lái)防止圖片重復(fù)出現(xiàn)。最后,使用background-position
屬性將圖片定位在中心位置。
.demo { background-image: url('https://example.com/image.png'); background-repeat: no-repeat; background-position: center center; }
接下來(lái),我們可以使用text-align: center;
屬性將文字居中。我們還可以為p
標(biāo)簽添加padding-top
和padding-bottom
屬性來(lái)設(shè)置頂部和底部的距離,以增加圖片和文字之間的間隔。最后,我們可以使用font-size
和color
屬性來(lái)設(shè)置文字的樣式。
.demo { text-align: center; padding-top: 100px; padding-bottom: 100px; font-size: 24px; color: #fff; }
通過(guò)使用這些屬性,我們可以輕易地創(chuàng)建一個(gè)具有間隔的圖片和文字組合。
這是一段文字。這是一段文字。這是一段文字。這是一段文字。這是一段文字。