본문 바로가기
이과/HTML,CSS,JS

HTML_IFRAME

by 코딩초밥 2021. 5. 11.
반응형

안녕하세요 코딩초밥입니다 ㅇㅅㅇ

내가 이미 작성한 HTML의 글을 나중에 또 가져올려면 어떻게하나요?

복붙해서 붙이면되죠? 하핫 뒤로가기버튼눌러주세요 당신은 이미 합격입니다.

근데 그렇게 해도 되는데 동료들이 이상한눈으로 처다볼겁니다. ㅇㅅㅇ

요번에는 예전에 자신이 작성한글이거나 아니면 다른곳에 HTML을 가져와서 현재 작업하고있는 HTML에 보여주도록 하는 ifram에서 배워보겠습니다!

 


※ifram 활용

작성한 코드이거나 다른곳에있는데이타를 내 html로 불러올수있습니다.

내가 만들어놓은 페이지를 다른 페이지에서 보여져서 개발자가 더 편하게 정보 공유를할수있는것입니다.!!

 

▶간단예제

<!DOCTYPE html>
    <html>  
    <body>
         <!-- 1.내가만든거 다시 가져오기. -->
        <iframe src="../Day01/index.html" width="300" height="500"></iframe>
        
        <!-- 내가 작성했던 데이터를 src에서 불러와주면됩니다 width,height는 사이즈입니다 -->

        <!-- 2.다른사이트 html보이기. -->
        <iframe src="http://aaa.dothome.co.kr/index.html" width="300" height="500"></iframe>
        
         <!-- src에 다른 사이트에 있는 데이타를 가져와 보일수도있습니다. -->
         <!-- <iframe src="http://naver.com" width="3000" height="500"></iframe> -->
         <!-- 네이버는 해보았는데 안열립니다 이유는 요즘은 보안강화된 https 들은 보안때문에 안됩니다. -->
        
        <!-- 3.엥커와 콜라보레이션 -->
        <iframe src="" name="aaa"></iframe>
        <a href="http://www.w3c.org" target="aaa">웹공식사이트</a>

        <!-- 링크<a>에 target을 iframe으로하여 iframe에 열리는 코딩입니다-->
        <!-- '웹공식사이트'를누르면 iframe안에 앵커에 지정된 사이트를 켜집니다 -->
    
       
        <!-- 4.다른 html에서 스크롤바 없에려면.-->
        <iframe src="../Day02/02_text.html" frameborder="0" width="100%" height="500"> </iframe>

        <!-- ifram으로 문서를가져왔는데 그쪽만 스크롤바가있으면 좀이상하겠죠? -->         
        <!-- heigh와 width를 불러오는 사이트보다 더크게만들면 스크류바가없어지고 그러면 그냥 써저있는걸로느껴짐 -->
    
       
    </body>
    </html>

반응형

'이과 > HTML,CSS,JS' 카테고리의 다른 글

CSS_의사선택자  (4) 2021.05.23
HTML_링크,이미지,표만들기  (4) 2021.05.13
HTML_서버와 통신 GET,POST  (1) 2021.05.11
HTML_다양한 입력Type  (14) 2021.05.10
HTML_파일보내기  (1) 2021.05.09

댓글