The solution to the problem that the full height setting percentage of the img tag does not take effect when the background is full

Vue project, the login page needs to use the <img tag to add a background; height: 100%, does not take effect;

As shown in the picture

solve:

width: 100%;
height: calc(100vh);
display: block;

reference:

css set width and height calc(100vh - 56px) widht: calc(12%+5em)_Stars and Moon 0’s Blog-CSDN Blog_css set width and height1, px Pixels, we generally use px in web page layout. 2. Percentage Generally speaking, percentage is relative to the parent element. There are more and more adaptive web page layouts, and percentages are often used. 3. Viewportviewport: visual window, that is, the browser. vw Viewport width, 1vw is equal to 1% of the viewport width vh Viewport height, 1vh is equal to 1% of the viewport height CSS3 uses Calccalc() to use general mathematical operation rules, but also provides smarter functions: > Use "+", "-", "*" and "/" four arithmetic operations;>Percent can be usedhttps://blog.csdn.net/baidu_40537062/article/details/119990780