Background image for certain sections?

Question

css

What is the best way to make an image a background for certain blocks, for example: there is a landing page, the first block of it comes with introductory information, this block should have an image for the entire width of the screen and an example height of 700px. I have ideas for only 2 options - this is through a tech written in an html file or through styles, adding the path to the image and the background-size: contain property to the desired block and a height of 700px 0 equal to the original size, otherwise if you do not set the height to the block, it will not stretch for the entire width. In general, the first option is also not simpler, you will have to take a steam bath with positioning in order to place the elements in the picture. Or are there other more obvious and understandable options that have not reached me?

Answer 1

You can write max-height: 700px; and set height: 100%; block will be max. stretch up to 700 px, and if you need less on other screens, it will shrink, at one time it helped me a lot with popup when I needed to make windows 800 by 600, well, so that they shrink on smaller screens

Answer 2

I didn’t understand much, but take a look at cover
htmlbook.ru/css/background-size
+
htmlbook.ru/css/background-position in the center