css
<p>css 宽高等比缩放 来源 <a href="https://juejin.cn/post/6978647140910727176">https://juejin.cn/post/6978647140910727176</a>
的几种方案
1:padding-top: 方案;
2:aspect-ratio</p>
<pre><code class="language-markdown">.container {
width: 100%;
aspect-ratio: 16 / 9;
}</code></pre>
<p>gap 用法 实现边距
ResizeObserver API 实现对某个元素尺寸变化的监听</p>
<p>css 滚动捕捉 效果展示 <a href="https://codepen.io/airen/full/mdRpboo">https://codepen.io/airen/full/mdRpboo</a></p>
<pre><code class="language-markdown">.container {
scroll-behavior: smooth;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scroll-snap-type: x mandatory;
scroll-padding: 20px;
}
img {
scroll-snap-align: center;
scroll-snap-stop: always;
}</code></pre>