Frames in HTML zijn een manier om het browservenster in meerdere secties te verdelen, die elk een ander HTML-document kunnen laden en weergeven. In dit artikel zullen we praktische voorbeelden zien van frames in HTML.

Hoewel het gebruik ervan de afgelopen jaren is afgenomen door de invoering van modernere en flexibelere technieken, zoals CSS en JavaScript is nog steeds te vinden op sommige websites, vooral op websites die in de jaren negentig en begin jaren negentig zijn gemaakt. die van 2000.

Hoe werken frames of frames in HTML?

Frames bestaan ​​uit twee elementen:

1. Frameset: Het element wordt gebruikt om het browservenster in rechthoekige secties te verdelen, die elk hun eigen HTML-document kunnen laden.

instagram story viewer

2. kaders: Het element wordt gebruikt binnen een om elk van de afzonderlijke secties te definiëren. En het verzendt om een ​​ander document aan te roepen dat in de frameset is geladen.

• Volgen met: iFrame-voorbeelden

Hoe maak je frames in HTML

Volg twee zeer eenvoudige stappen om een ​​HTML-document met frames te maken:

1. Maak een HTML-document dat de structuur van de frames definieert met behulp van het element. Bijvoorbeeld:

Bestand 1: frameset.html

2. Maak een of meer HTML-documenten die in de frames moeten worden geladen.

Bestand 2: frame1.html

Dit is kader 1

Bestand 3: frame2.html

Dit is kader 2

Frame-attributen in HTML

Enkele van de belangrijkste elementattributen Zijn:

• scrollen: Dit attribuut wordt gebruikt om het uiterlijk van de schuifbalken in het frame te bepalen. Het kan de waarden "auto", "ja" of "nee" hebben.

• noresize: Dit attribuut wordt gebruikt om te voorkomen dat de gebruiker de grootte van het frame wijzigt.

• jam: Dit attribuut wordt gebruikt om het frame een naam te geven, wat handig kan zijn om naar het frame te verwijzen in links en scripts.

• src: Dit attribuut wordt gebruikt om de URL op te geven van het HTML-document dat in het frame moet worden geladen.

• framerand: Dit attribuut geeft aan of frames randen moeten hebben of niet. Mogelijke waarden zijn "1" (om randen weer te geven) of "0" (om geen randen weer te geven). Bijvoorbeeld, .

• grens: Dit attribuut definieert de breedte van de rand tussen de frames in pixels. Bijvoorbeeld, maakt een rand van 5px tussen de frames.

• frameafstand: Dit attribuut is vergelijkbaar met grens. Het definieert ook de ruimte tussen de frames in pixels. Bijvoorbeeld, zal een opening van 10 px instellen tussen de frames.

• rand kleur: Met dit attribuut kunt u de randkleur van de kaders wijzigen. Elke geldige kleur kan worden opgegeven. Bijvoorbeeld, maakt de rand van de kaders rood.

Gebruiksvoorbeeld:

Hoe te linken naar een specifiek frame

We kunnen een link openen in een specifiek frame met behulp van het attribuut doel Op het etiket. De waarde van doel moet hetzelfde zijn als de framenaam (jam attribuut van ). Bijvoorbeeld:

in menu.html
Pagina 1
Pagina 2

Als u in dit geval op de koppelingen "Pagina 1" of "Pagina 2" in het menuframe klikt, wordt de overeenkomstige pagina in het frame "inhoud" geladen.

Hoe de frames te breken

Als u wilt dat een link een pagina opent buiten de frameset (d.w.z. de hele frameset vervangt), kunt u de speciale waarde gebruiken _bovenkant voor het attribuut doel. Bijvoorbeeld:

in menu.html
uit de kaders gaan

Wanneer u op "Frames afsluiten" klikt, laadt de browser "pageOutofFrames.html" in het volledige venster, ter vervanging van de frameset.

Voorbeeld om het scherm met kaders in twee kolommen te verdelen

Dit voorbeeld verdeelt het scherm in twee even grote kolommen. Elke kolom laadt een andere HTML-pagina.

Voorbeeld om een ​​navigatiezijbalk met frames te maken

In dit voorbeeld wordt een zijbalk gemaakt die 25% van het scherm beslaat en wordt gebruikt voor navigatie. De rest van het scherm wordt gebruikt om de hoofdinhoud weer te geven.

Voorbeeld om het scherm op te delen in rijen en kolommen

Dit complexere voorbeeld verdeelt het scherm in vier gelijke delen. Elke sectie laadt een andere HTML-pagina.

Voorbeeld van topnavigatie met HTML-frames

Maak een bestand dat twee frames op een rij definieert. De twee bestanden die het definieert zijn: een voor de navigatie (die 20% van de breedte van het venster in beslag neemt) en een voor de hoofdinhoud (die de rest van de breedte van het venster in beslag neemt).

Vervolgens moet u de bestanden "navigation.html" en "content.html" maken. "Navigation.html" kan er bijvoorbeeld zo uitzien:

Pagina 1

Pagina 2

Pagina 3


En "content.html" zou zoiets kunnen zijn:

Welkom op onze website!

Hier komt de inhoud van de pagina die in de navigatie is geselecteerd.

Wanneer u in dit geval op een link in "navigation.html" klikt, wordt de overeenkomstige pagina in het "content"-frame geladen.