iframe巢狀（等寬高比自適應：aspectRatio）

SimoonJia發表於2024-03-10
巢狀

可以使用iframe引入外部網頁

  <iframe
        title="vimeo-player"
        src="https://player.vimeo.com/video/919942180?h=a56246711a"
        width="640"
        height="360"
        style={{ width: '100%', aspectRatio: '16/9' }}
        frameBorder="0"
        allowFullScreen
      />

如果你希望 iframe 的寬高比保持固定，可以結合使用 style 屬性來實現

<iframe src="https://www.example.com" style="width: 100%; aspect-ratio: 16/9;"></iframe>

iframe 的寬度被設定為父容器的寬度，並且高度會按照16:9的寬高比進行自動調整

相關文章