如何根据显示效果使div垂直响应

Question

I want to make a div vertically responsive just like <img src="img.jpg" style="max-width:100%; height:auto;"> , so that the image does not lose its shape in any condition and height changes according to the re-sizing browser.. similarly if i make a slider div with width 100% and initially max-height 600px . So I want it's to reduce height like it's width. If I use vh method then it does not give good result in mobile view. A good example of a working slider is on the following link.

example slider.

Answer 1

use css instead of <img />

.image{
   background-image    : url(<image_url>);
   background-size     : cover;
   background-position : center;
   background-repeat   : no-repeat;
}