在網(wǎng)頁設計中,常常需要在圖片下方展示一段文字來補充圖片的內容。這時候,我們就需要使用CSS來實現(xiàn)文字放在圖片下方的效果。
img { display: block; margin: 0 auto; } img + p { text-align: center; margin-top: 10px; }
首先,我們需要將圖片設置為塊級元素并讓它水平居中。這可以通過以下CSS代碼實現(xiàn):
img { display: block; margin: 0 auto; }
接下來,我們需要讓文字放在圖片下方并讓它居中。我們可以使用相鄰兄弟選擇器(+)來選中圖片下面的段落,并對段落設置以下CSS代碼:
img + p { text-align: center; margin-top: 10px; }
這段代碼會讓段落居中對齊,并在圖片下面留出10像素的間距。你可以根據(jù)實際需要來調整這個值。