html - 具有纵横比的绝对定位 div

Question

问题是有父元素和子<div>元素，它们都响应纵横比。和孩子<div>的大小（例如宽度）需要是父母的一些百分比。他们都有position: absolute

有两种方法可以在<div>元素上设置响应纵横比

1. 和vw/vh
2. 在子元素或伪元素上使用 % 设置 padding-top/bottom

1. 第一种方法的问题：我需要<div>在 responsive(with aspect ratio) 内部设置<div>，当更改父级时也会更改子级大小，但vw/vh不取决于父级
2. 第二种方法的问题：当父元素的位置是绝对的时，在子元素上使用 % 设置填充不会改变父元素的高度

我想只用 CSS

有没有办法做到这一点？谢谢

标签： htmlcss