在前端开发中,经常需要在网页中添加图片,同时又需要在图片下方加上文字说明。这时候就需要用到CSS中的一种技术,即将字放在图片的下方。 img { display: block; margin: aut
在前端开发中,经常需要在网页中添加图片,同时又需要在图片下方加上文字说明。这时候就需要用到CSS中的一种技术,即将字放在图片的下方。
img { display: block; margin: auto; /* 居中显示图片 */ } p { text-align: center; /* 文字居中显示 */ margin-top: 10px; /* 文字与图片之间的间距 */ }
在上面的代码中,我们将图片设置为块级元素,并让其居中显示。对于文字,则是让其居中显示,并与图片之间留出一定的间距。
如果想要更进一步的美化,可以尝试在图片周围添加一些圆角或者阴影等特效。在实际项目中,可以根据需要调整CSS属性,实现更加符合设计要求的效果。
粉丝
0
关注
0
收藏
0