HTML에서 Iframe의 대안

Subodh Poudel 2023년2월19일
  1. HTML에서 Iframe의 대안으로 object 태그 사용
  2. HTML에서 Iframe의 대안으로 embed 태그 사용
HTML에서 Iframe의 대안

HTML에서 Iframe을 사용하여 웹 페이지에 웹 페이지를 포함할 수 있는 인라인 프레임을 지정합니다. 이 튜토리얼에서는 웹 페이지를 표시하기 위해 Iframe에 대한 몇 가지 다른 대안을 소개합니다.

HTML에서 Iframe의 대안으로 object 태그 사용

HTML의 object 태그를 사용하여 웹 페이지에 외부 리소스를 포함할 수 있습니다. 태그를 사용하여 웹페이지에 다른 웹페이지를 표시할 수 있습니다. object 태그는 HTML에서 iframe 태그의 대안입니다. 태그를 사용하여 이미지, 비디오, 오디오 등과 같은 다양한 멀티미디어 구성 요소를 포함할 수 있습니다. object 태그에는 포함할 웹 페이지의 URL을 정의할 수 있는 data 속성이 있습니다. widthheight 속성을 사용하여 컨테이너의 너비와 높이를 설정할 수도 있습니다.

예를 들어 object 태그를 작성하고 data 속성에 URL https://theuselessweb.com/을 설정합니다. 그런 다음 object 태그의 widthheight 속성을 800으로 설정합니다. 다음으로 type 속성을 text/html로 설정합니다. 마지막으로 object 태그를 닫습니다.

브라우저에서 다음 웹 페이지를 로드하면 컨테이너에 포함된 웹 페이지를 볼 수 있습니다. 내장된 웹 페이지와 상호 작용할 수 있습니다. text/html 유형은 포함된 콘텐츠가 HTML임을 나타냅니다. 이런 식으로 object 태그를 사용하여 HTML의 iframe 태그에 대한 대안인 웹 페이지에 웹 페이지를 포함할 수 있습니다. 그러나 object 태그 대신 iframe 태그를 사용하는 것이 좋습니다.

예제 코드:

<object data="https://theuselessweb.com/"
width="800"
height="800"
type="text/html">
</object>

HTML에서 Iframe의 대안으로 embed 태그 사용

embed 태그는 object 태그와 유사하며 같은 용도로 사용됩니다. embed 태그를 사용하여 웹 페이지에 다양한 외부 리소스를 포함할 수 있습니다. PDF, 이미지, 오디오, 비디오 및 웹 페이지와 같은 미디어를 포함할 수 있습니다. 태그는 원하는 콘텐츠를 포함할 수 있는 컨테이너를 정의합니다. embed 태그는 자동 닫히는 태그입니다. src 속성을 사용하여 포함할 웹 페이지의 URL을 지정할 수 있습니다. 태그에는 포함할 콘텐츠 유형을 지정하는 type 속성이 있습니다. object 태그와 마찬가지로 높이와 너비를 유사하게 정의할 수 있습니다.

예를 들어 embed 태그를 작성하고 type 속성을 text/html로 설정합니다. 다음으로 src 속성을 작성하고 https://theuselessweb.com/으로 설정합니다. 그런 다음 컨테이너의 높이와 너비를 500800으로 설정합니다.

높이와 너비의 측정 단위는 픽셀입니다. 이런 식으로 HTML에서 iframe 태그 대신 embed 태그를 사용할 수 있습니다. 그러나 embed 태그보다 iframe 태그를 사용하는 것이 좋습니다.

예제 코드:

<embed type="text/html" src="https://theuselessweb.com/" width="800" height="500">
Subodh Poudel avatar Subodh Poudel avatar

Subodh is a proactive software engineer, specialized in fintech industry and a writer who loves to express his software development learnings and set of skills through blogs and articles.

LinkedIn