עבודה עם iFrames

תג <iframe> מאפשר להטמיע דף אינטרנט אחר בתוך דף ה-HTML הנוכחי.

שימוש בסיסי ב-iFrame

ניתן להטמיע אתר אחר באמצעות תג <iframe> ולציין את הכתובת של האתר באמצעות המאפיין src.

        <iframe src="https://www.example.com" width="600" height="400"></iframe>
        

כאן הוספנו iFrame שמציג את האתר Example בגובה ורוחב שנבחרו.

מאפיינים נוספים של iFrame

ניתן להשתמש במאפיינים נוספים כדי לשלוט על התנהגות ה-iFrame, כגון frameborder ו-allowfullscreen.

        <iframe src="https://www.example.com" width="600" height="400" frameborder="0" allowfullscreen></iframe>
        

המאפיין frameborder="0" מסיר את המסגרת סביב ה-iFrame, והמאפיין allowfullscreen מאפשר לצפות בתוכן במצב מסך מלא.

הגבלת גובה ורוחב של iFrame

כדי למנוע מה-iFrame להסתיר תוכן חשוב, ניתן להגדיר לו גובה ורוחב מדויקים.

        <style>
          iframe {
            width: 100%;
            max-width: 800px;
            height: 400px;
            border: 1px solid #ddd;
          }
        </style>
    
        <iframe src="https://www.example.com"></iframe>
        

כאן השתמשנו ב-CSS כדי להגדיר גובה ורוחב מקסימליים ל-iFrame.