반응형
<iframe> 이라는 새로운 태그를 발견했다.
역시 익숙해지는 데는 적용하는 것,
iframe1.html 파일을 생성 후
iframe2.html 파일 경로를 <iframe src =""> 에 넣어보았다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=
, initial-scale=1.0">
<title>Document</title>
</head>
<body>
iframe test1
<iframe src = "C:\Users\user\바탕 화면\testhtml\iframetest2.html"
style = "width : 100%; height: 100vh;">
</iframe>
</body>
</html>
문자는 약간씩 변경했었고,
iframetest1 안에
iframetest2 창이 들어가는 것을 볼 수 있다.
하지만 세로를 꽉채우고 싶어서 widht : 100% 를 했으나, 100%가 적용 되지 않아서 찾아보니
iframe의 경우는 style = width 에다가 100% 대신 100vh를 넣으면 된다고 한다.
이것이 늘어난 결과!
viewport height, viewport width의 줄임말로서 vh, vw로 이용되고 있다.
참고하기 좋은 글도 복사해 왔다.
[CSS] iframe height:100%가 안될 때 viewport를 이용하여 해결하기
Security engineer, Developer and H4cker
www.hahwul.com
반응형
'HTML, CSS' 카테고리의 다른 글
| [엘리코딩] navbar 만들기 (0) | 2021.08.13 |
|---|---|
| mousehover시 opacity 부드럽게/천천히 변경 (0) | 2021.08.12 |
| input에 null값 넣지 못하게 하기, required (0) | 2021.02.16 |
| CSS로 글자 수직정렬하기 (0) | 2021.02.05 |
| [HTML] 비디오를 첨부했는데 재생 버튼이 안 나올 때(controls) (0) | 2021.02.05 |