How to write text on photo in css?

Question

css

Please tell me how to write text on the photo?

Answer 1

Div, background photo in diva, text in diva. If, as in the screenshot, it is enough to set the background color, the picture is not needed.

Answer 2

div.wrapper
   image
   text

.wrapper {
position: relative;
}

.text {
position: absolute;
left: 50%;
top: 50%
transform: translate(-50%, -50%);
}

An image can be darkened by adding an overlay on top of it, setting z-index: 1 for the overlay, and z-index: 2 for text;