Introducere în Iframes în HTML

Iframele în HTML nu sunt altceva decât cadre inline care sunt utilizate ca document HTML pentru a adăuga un alt document HTML în el. Este utilizat mai ales în paginile web sau în procesele de dezvoltare web pentru a include un alt conținut printr-o altă sursă, cum ar fi reclame pe pagina respectivă.

Majoritatea designerilor web folosesc Iframe pentru a prezenta aplicații interactive pe site-ul sau în paginile web. Este posibil prin utilizarea javaScript sau prin utilizarea atributului țintă în HTML.

Scopul principal al Iframe este afișarea unei pagini web în cadrul altei pagini web. Cadrul în linie trebuie afișat folosind o etichetă numită

  • Este, de asemenea, posibil să acordăm o anumită înălțime și lățime Iframe noastre în format de pixeli după cum urmează:
  • În sintaxa de mai sus, toate lucrurile vor fi la fel, în plus, putem specifica înălțimea și lățimea în format de pixeli definind ca

Exemplu:

  • O altă metodă pentru definirea înălțimii și lățimii la iframe folosind valori prin CSS este prezentată în sintaxa de mai jos:
  • Toate lucrurile sunt la fel ca mai sus, doar făcând schimbări în specificarea valorilor.

Exemplu:

  • O altă caracteristică este adăugată la iframe este că putem elimina chenarele deja definite din cadru folosind proprietatea border none. Sintaxa pentru aceasta este următoarea:
  • Cu ajutorul CSS, este posibil, de asemenea, să faceți multe lucruri cu chenarul, cum ar fi modificarea dimensiunii graniței, aplicarea unei anumite culori pe margine etc.

Iframe poate fi utilizat ca țintă pentru o legătură folosind sintaxa:

  • În sintaxa de mai sus, src este URL-ul nostru normal, aici atributul țintă al linkului va face referire la atributul de nume din eticheta noastră iframe.

Exemplu:

Atribut de etichetă Iframes

Există diferite etichete de atribute utilizate în Iframes, acestea sunt următoarele:

  • Src: Acest atribut este folosit pentru a insera fișiere care trebuie să fie incluse în cadru. URL specifică pagina web țintă care va fi încărcată într-un iframe.
  • Nume: Nume este un atribut care este utilizat pentru a da un anumit nume de identificare cadrului. Este cel mai util acolo unde creați un link pentru a deschide o altă pagină web.
  • allowfullscreen: Acest atribut vă permite să vă afișați cadrul în formatul cu lățime completă. deci trebuie să setăm valoarea adevărată pentru ca această funcție să se întâmple
  • Frameborder: Acesta este un atribut util care vă permite să afișați sau să nu afișați chenare la cadru. Valoarea 1 este de a arăta bordura & 0 pentru a nu se afișa marginea în cadru
  • Lățime de marjă: Vă permite să definiți spațiul între partea stângă și dreapta a cadrului
  • Marginheight: Vă permite să definiți spațiu între partea superioară și inferioară a cadrului.
  • Defilare: Aceste atribute folosesc pentru a controla dacă bara de defilare va apărea sau nu la cadru. valorile incluse sunt „da” sau „nu” sau „auto”.
  • Înălțime: folosit pentru a defini înălțimea cadrului. Vremea în% sau în pixeli
  • Lățime: folosit pentru a defini lățimea cadrului. Vremea în% sau în pixeli
  • Longdesc: cu ajutorul acestui atribut, puteți conecta o altă pagină care are o descriere lungă a conținutului cadrului dvs.

Exemple de Iframes în HTML

Iată câteva exemple de Iframes în HTML care sunt explicate mai jos:

Exemplul # 1

Să luăm în considerare un exemplu în care vom arăta cum să creăm un iframe cu o înălțime și o lățime specifică.

Cod:

Demo HTML Iframes


Aici vom arăta un exemplu de Iframe care conține specifc Înălțime și lățime în format pixeli

ieşire:

Exemplul # 2

Să luăm în considerare un alt exemplu în care vom arăta cum să creăm un iframe cu o înălțime și o lățime specifică. Dar în acest exemplu, specificăm înălțimea și lățimea prin CSS. Aici putem vedea că bara de defilare este ajustată în funcție de dimensiunea conținutului.

Cod:

Demo HTML Iframes


Aici vom arăta un exemplu de Iframe care conține specifc Înălțime și lățime în format pixeli

ieşire:

Exemplul # 3

Aici avem în vedere un exemplu în care vom adăuga un chenar la iframe adăugând câteva proprietăți CSS suplimentare pentru a arăta o modificare a dimensiunii graniței, o schimbare de culoare a bordurii, etc. Deci putem adăuga atât cât stil la iframe noastre.

Cod:

Demo HTML Iframes


Aici prezentăm un exemplu de Iframe care conține graniță cu unele proprietăți CSS suplimentare

ieşire:

Exemplul # 4

Să luăm în considerare un alt exemplu în care vom arăta cum atributul țintă de a deschide o legătură a unei pagini web folosind un iframe.

Cod:

Iframe Demo - țintă pentru o legătură


EDUCBA

Când ținta unei legături se potrivește cu numele unei iframe, link-ul se va deschide în iframe.

ieşire:

Rezultatul țintă:

Așa cum se arată mai sus Exemplu, putem face clic pe linkul țintă EDUCBA, astfel încât va deschide următoarea pagină web prezentată mai jos.

Concluzie

Din toate informațiile de mai sus, a ajuns la concluzia că iframe este un cadru inline care include un alt document HTML în sine. A fost considerat cel mai puternic element HTML în scopuri de web design. Cu ajutorul acestuia, puteți adăuga, de asemenea, conținut din altă sursă. Folosește diferite tipuri de atribute HTML, cum ar fi Atribute globale, Atribute eveniment, unele pagini înrudite etc.

Articole recomandate

Acesta este un ghid pentru Iframes în HTML. Aici vom discuta despre sintaxa, atributul tag-ului iframelor în HTML împreună cu diversele exemple și implementarea codului. De asemenea, puteți consulta următoarele articole pentru a afla mai multe -

  1. Comenzi de seleniu
  2. Rame HTML
  3. Link de text HTML
  4. Creați tabele în HTML

Categorie:

Instrumente de dezvoltare web