Hypertext Markup Language (HTML) proporciona la possibilitat de dividir una pàgina en diverses finestres: "marcs". Cadascun dels marcs pot tenir la seva pròpia font d’Internet per mostrar. Aquest mecanisme es pot utilitzar per inserir pàgines d'altres llocs a pàgines del vostre lloc.
És necessari
Bloc de notes de l’editor de text
Instruccions
Pas 1
El codi HTML d'una pàgina és un conjunt d'instruccions per al navegador que indiquen on a la pàgina s'han de mostrar cadascun dels seus elements i com ha de quedar. Aquestes instruccions s'anomenen "etiquetes" i, per crear una pàgina que en conté una o més, cal escriure el conjunt d'etiquetes adequat. Comencem per les etiquetes que creen un contenidor per a tots els marcs de la pàgina:
Aquestes són les etiquetes d'obertura i de tancament del contenidor: les etiquetes que formen els marcs hauran de col·locar-se entre elles. En HTML, les etiquetes tenen "atributs": contenen informació addicional sobre les propietats de l'element de pàgina, la visualització del qual especifica aquesta etiqueta. A l'etiqueta d'obertura del contenidor, heu d'especificar un atribut que contingui informació sobre com el navegador ha de dividir l'espai de la pàgina entre els seus marcs:
L'atribut "cols" d'aquest exemple de codi especifica que la pàgina s'ha de dividir verticalment en dos marcs, amb l'esquerra que ocupa el 20% de l'amplada de la finestra i la dreta el 80%. Si en lloc de l'atribut "cols" especifiqueu l'atribut "files", la pàgina es dividirà horitzontalment:
En lloc d’un número, podeu escriure un asterisc (*):
Això vol dir que al segon fotograma se li proporcionarà tot l'espai restant. Les mides dels fotogrames es poden especificar no en percentatges, sinó en unitats de mesura que s'utilitzen més sovint en el disseny de la pàgina, en "píxels":
Pas 2
L'etiqueta HTML del propi marc, que s'ha de col·locar al contenidor, s'escriu de la següent manera: L'atribut "src" de l'etiqueta "marc" conté l'adreça de la pàgina web que el navegador hauria de carregar en aquest marc. Una adreça escrita d'aquesta manera s'anomena "absoluta": comença amb el protocol https://. Però si es tracta d’una pàgina del vostre propi lloc i es troba a la mateixa carpeta (o subcarpeta), no cal que especifiqueu l’adreça absoluta, només n’hi haurà prou amb el nom del fitxer i el camí cap a la subcarpeta. Aquesta adreça es dirà "relativa": - Els límits entre els marcs de la pàgina per defecte es poden moure amb el ratolí. Aquesta característica està desactivada per l'atribut noresize: - Hi ha dos atributs que determinen la mida dels marges entre els marcs: marginheight estableix el marge vertical (superior i inferior) i l'amplada del marge - horitzontalment (dreta i esquerra): - Utilitzant un altre atribut - "Desplaçament": podeu indicar al navegador les regles per a les barres de desplaçament del marc: el valor "automàtic" especifica que les barres de desplaçament haurien d'aparèixer segons sigui necessari, és a dir, quan el contingut no encaixa dins del marc. Si definiu el valor a "sí", aquest marc sempre tindrà barres de desplaçament i, al contrari, el valor "no" impedeix la visualització de barres de desplaçament. Si les pàgines del contenidor funcionen amb scripts JavaScript que realitzar operacions en fotogrames adjacents, pot ser que sigui necessari distingir els fotogrames per nom. L'atribut que conté el nom del marc s'anomena nom:
Pas 3
Aquestes definicions HTML són suficients per crear una pàgina senzilla a partir de diverses pàgines d'altres llocs. Per fer-ho, necessitareu qualsevol editor de text, per exemple, un bloc de notes estàndard. En ell, creeu un document nou i escriviu aquestes etiquetes html:
A continuació, deseu aquest codi amb una extensió htm o html, per exemple, test.html. Tot està a punt, si obriu aquest document amb un navegador, el resultat serà així:
Pas 4
Hi ha un altre tipus de marc: "flotant". Es pot ubicar dins d’una pàgina normal, no dividida en marcs. Aquest marc té atributs d’amplada i alçada addicionals que defineixen les seves dimensions. El codi d'aquesta etiqueta pot tenir aquest aspecte: