css怎么把标签放到图片 |css 根据屏幕大小 显示字体

img {
position: relative; 
}
img:before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
background: rgba(0,0,0,0.3); 
}
p {
position: absolute; 
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
color: white; 
}

根据上面的代码，大家首先将图片设置为相对定位，使大家能够在其上面使用绝对定位。然后，大家在图像前插入了一个伪元素，并将其设为绝对定位。这个伪元素将作为覆盖整个图片的半透明背景。最后，大家将文字或标签设置为绝对定位，并通过transform将其移到图片的中心。

如果您想将标签放在图片的其他位置，可以通过更改top和left属性的值来实现。同时，您也可以根据需要更改背景的颜色和不透明度。使用这些技巧，您可以在网页上创建有趣的、令人印象深刻的效果。