How to add an inscription to a colored background?

Question

css

Good afternoon!
At the moment I am solving a problem in which I need to add labels to the backgrounds of the blocks in accordance with this layout . In my made up version of the page for blocks, only background colors are set, but inside the background (not inside the block) I'm trying to implement the very inscriptions from the layout.
But what features does CSS3 offer in this regard?
Thanks in advance!

Answer 1

It is possible like this:

#news:before {
    content: 'NEWS';
    position: absolute;
    top: 0;
    left: 0;
    font-size: 200px;
    opacity: .2;
}
#news header,
#news main {
    position: relative;
    z-index: 1;
}

Well, customize the styles for yourself.