How to insert in “background” h1 and p?
I must insert h1 and p in one background.How?
Html
> <!doctype html>
> <html>
> <head>
> <title>Кропивницкий</title>
> <link href="Test.css" type="text/css" rel="stylesheet">
> <link rel="icon" href="/favicon/ico.png" type="images/x-icon">
>
> </head>
> <body>
> <div id="text">
> <h1>Кропивницький</h1>
> <p>місто в центрі Україні</p>
> </div>
> </body>
> </html>
CSS
> html {
> display: flex;
> justify-content: center;
> align-items: center;
> height: 100%;
> font: 1em/1.4 Montserrat, sans-serif;
> letter-spacing: -.1em;
> background: url(1.jpg) center / cover no-repeat;
> }
>
> #text h1 {
> position: relative;
> align-items: center;
> width: 800px;
> height: 250px;
> background: rgb(255,255,255, 0.7);
> color: #fff;
> text-align: center;
> font-weight: normal;
> font-size: 3em;
> display: flex
> }
> #text p{
>
> }