使用CSS可以讓我們靈活地控制圖片在網頁中的顯示效果。其中一種操作是把圖片沿著垂直方向進行偏移,也就是往下。
img { margin-top: 20px; }
上面的代碼中,我們使用了margin-top屬性來使圖片下移20像素。默認情況下,圖片是從文本基線對齊顯示的,也就是圖片的底部與文本的底部對齊。因此,我們將margin-top設為正值,即可使圖片向下偏移。
當然,我們也可以使用負值來讓圖片往上偏移:
img { margin-top: -20px; }
與此類似,我們還可以使用padding-top屬性來設置圖片與其周圍元素的間距,并實現類似的效果:
img { padding-top: 20px; }
這些CSS屬性可以讓我們更好地控制圖片在網頁中的表現。不僅可以調整偏移,還可以設置大小、對齊、邊框等。通過合理運用這些屬性,我們可以為網頁增添更多的美感和實用性。