*{ margin:0; padding:0;} .kech{ background-image: url(tu.jpg) ;background-size:100% auto;background-repeat: no-repeat; width:100%;} .kech:before{content: ""; display: block; padding-top: 100%;} .kech1 img{ width:100%;}
background-size:100% auto;
This is the sentence width 100% height equal proportion
background-size setting image. . .
The div height needs to be solved by js. . .
background-size:100% auto; This is of no use. I tried it. The div height needs to be solved by js. How to write this JS
I know this, you need to make a container with a fixed height-to-width ratio.
Here is a little trick, that is, padding-bottom is calculated according to the width ratio of the parent element. , instead of calculating by height, so you can use overflow padding-bottom here
width:100%;
height::0;
padding-bottom:100%//You can set the proportion here
Then add a background image
Please refer to this article http://zihua.li/2013/12/keep-height-relevant-to-width-using-css/
http: //zihua.li/2013/12/keep-height-relevant-to-width-using-css/
This article is good. I divided the height of my image by its width and got a percentage of 46%; Then padding-bottom: 46%; perfectly solved this problem
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
