To optimize the speed of loading pages recommend to specify the size in HTML. How to be in the case of responsive layout?

  • one
    This is not to optimize download speed, but to build the site structure based on html alone, while css has loaded the browser correctly arranged the position of the page elements so that when css loads the user does not notice a jump-like change in the positions of all the elements. - Andrey Fedorov

1 answer 1

You can like this:

.img-container{ /*любые 'отзывчивые' стили*/ width:calc(10vw + 100px); height:20vh; background: lightblue; } 
 <div class = 'img-container'> <img src = './imgSrc' width = '100%' height = '100%'> </div> 

  • Unfortunately, it will not pass validation. - A. Gr
  • "In HTML 4.01, in HTML5, the value must be in pixels." - A. Gr