내부 스크롤 막대를 사용해도 iOS Safari에서 IFrame을 반응형으로 만드는 방법은 무엇입니까?

iOS Safari에서 IFrame을 반응형으로 만들기

문제 설명

IFrame을 사용하여 웹사이트에 콘텐츠를 통합하려면 IFrame이 반응형이어야 합니다. iframe 너비를 100%로 설정하는 것과 같은 기본 CSS 솔루션으로는 충분하지 않을 수 있습니다. 그러나 iframe 콘텐츠에 내부 스크롤 막대가 있는 경우 응답성을 달성하는 것이 특히 어렵습니다.

스크롤 영역이 있는 반응형 IFrame

콘텐츠에 스크롤 영역이 포함된 경우에도 iOS Safari에서 IFrame을 반응형으로 만들려면 두 가지 옵션이 있습니다.

옵션 1: 수정 콘텐츠

1. iframe 콘텐츠의 스크롤 가능 영역(예: div#ScrolledArea) 너비를 다음과 같이 설정합니다.

   width: 1px;
   min-width: 100%;
   *width: 100%;

2. 이렇게 하면 iOS Safari가 스크롤 영역이 작동할 수 있도록 iframe의 크기를 적절하게 조정하세요.

옵션 2: iframe 수정

1. iframe 콘텐츠에 액세스할 수 없는 경우 다음 CSS를 iframe 자체에 적용할 수 있습니다.

   iframe {
       width: 1px;
       min-width: 100%;
       *width: 100%;
   }

2. 그러나 iframe에 scrolling="no"를 추가하여 스크롤을 비활성화해야 합니다. HTML:

   <iframe height="950" width="100%" scrolling="no" src="Content.html"></iframe>

참고

옵션 2에서 iframe의 스크롤을 비활성화하면 iframe 콘텐츠의 스크롤 영역을 사용할 수 없습니다. 그러나 iframe 콘텐츠(옵션 1)를 수정하면 스크롤 기능을 유지할 수 있습니다.

위 내용은 내부 스크롤 막대를 사용해도 iOS Safari에서 IFrame을 반응형으로 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!