아이프레임(iframe) 높이(height:세로) 자동조절 > 그누보드5 팁자료실

그누보드5 팁자료실

아이프레임(iframe) 높이(height:세로) 자동조절 정보

아이프레임(iframe) 높이(height:세로) 자동조절

본문

요즘 아이프레임을 쓸 일이 별로 없지만 프로그래밍을 하다가 보면 꼭 필요한 때가 있죠.

간단한 예제 올려봅니다.

--------------------------------------

<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<title>아이프레임(iframe) 높이(height:세로) 자동조절</title>
<style type="text/css">
*{margin: 0 auto;} 
body {} 
#my-iframe {display:block;border:none;height:100vh;width:100vw}
</style>
<head>
<body>
<iframe id="my-iframe" src="대상 url 기입" crolling="no" frameborder="none"></iframe>
</body>
</html>

--------------------------------------

뷰포트 (Viewport units: vw, vh, vmin, vmax) 단위 호환성은 아래 링크와 같습니다.

https://caniuse.com/#feat=viewport-units

--------------------------------------

 

추천
9

댓글 17개

전체 2,431 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT