[分享]css中如何将文字浮在图片上方

在前端开发中，有时需要将文字浮在图片上方，增加页面视觉效果。这可以通过CSS中的属性和zindex属性来实现。首先，需要设置图片的属性为relative，使其成为一个相对定位的元素。然后，将文本的属性...

在前端开发中，有时需要将文字浮在图片上方，增加页面视觉效果。这可以通过CSS中的position属性和z-index属性来实现。

首先，需要设置图片的position属性为relative，使其成为一个相对定位的元素。然后，将文本的position属性设置为absolute，并设置其top和left属性来调整文本在图片上方的位置。最后，设置文本的z-index属性比图片的z-index属性大，则会将文本浮在图片上方。

img {
  position: relative;
  z-index: 1; 
}

p {
  position: absolute;
  z-index: 2; 
  top: 50px;
  left: 50px;
} 

这样就实现了将文本浮在图片上方的效果。可以通过修改top和left属性来调整文本的位置，达到理想的效果。