Cadre în html

structura cadru EXEMPLU

Fereastra browserului poate fi împărțită în cadre, adică în regiunile adiacente unul cu celălalt. În fiecare dintre aceste zone, puteți încărca HTML-pagini. Pe de exemplu, ar fi mai clar, de a crea un nou fișier numit index.html cu următorul cod:


Într-o fereastră de browser, acesta va arăta astfel:

fereastra browser-ului este împărțit în 3 părți. Trebuie să spun că acesta este singurul caz în care într-un document HTML nu conține tag-uri . In schimb, ei folosesc tag-uri . și indică faptul că fereastra de browser-ul este împărțit în mai multe zone - cadre.

Cât de mult vor fi aceste domenii și modul în care acestea vor fi localizate depinde de doi parametri tag .

  • - rânduri de puncte pentru a sparge o fereastră în zona orizontală. Mai mult decât atât, numărul de valori în acest parametru, atât de multe domenii. În acest exemplu, rânduri = "30%, 10%, 60%." și anume trei lățime orizontală câmp al primului - 30% din lățimea ecranului, a doua lățime - 10%, iar a treia - 60%.
  • cols - puncte pentru a sparge o fereastră în zona verticală.

  • în interiorul tag-ul situate tag-uri unice . și nu ar trebui să fie la fel de mult ca și zona predeterminată. Fără parametri, aceste tag-uri sunt inutile.

    Ne vom uita la parametrii tag exemple.

    Să definim această opțiune pentru cadrele noastre din exemplu. Pentru a face acest lucru, creați trei HTML-pagini obișnuite:

    top.html cu următorul cod:

    Cadre în site-ul antet html

    menu.html cu următorul cod:

    cu codul content.html:

    Conținutul Conținutul conținutul paginii.


    Aceste pagini trebuie să fie în același director ca index.html.
    Acum, adăugați etichetele parametru src Pagina noastră de index.html:


    Acum, pagina noastră index.html, browser-ul va arata astfel:

  • nume - numele cadrului care va fi utilizat pentru a se referi la acest cadru.

    Adăugați această opțiune etichetă .


    Acum, creați un alt cod other.html pagina:

    Conținutul paginii de conținut other.html other.html


    Și acum, pentru a face o pagină de link primul element menu.html de pe această pagină și indică faptul că este necesar pentru a deschide pagina într-un cadru other.html conținut pe nume:


    Acum, când faceți clic pe primul element de meniu în cadrul conținutului va încărca pagina other.html

    Parametrul țintă poate specifica alte valori:
    _self - sarcină în același cadru de referință este.
    _top - încărcare în ecran complet, închizând cadrele rămase (utilizat de obicei pentru link-uri către alte site-uri).

  • marginwidth - definește adâncitura în cadru de la marginea din stânga la conținut.

  • marginheight - definește adâncitura în cadru de marginea superioară a conținutului.

  • defilare - în cazul în care conținutul cadrului nu se încadrează în fereastră, acesta va apărea bare de derulare, uneori se rupe de design. Acest parametru ajută la controlul afișarea barelor de defilare. Poate lua valori: da, nu, auto.

  • noresize - dacă setați cursorul mouse-ului pe rama cadru, îl puteți rula de la mișcare. Pentru a preveni această posibilitate și această opțiune este utilizată.

    Să facem din ultimele patru parametri din pagina de cod index.html nostru:


    Acum, pagina noastră va arăta astfel:

  • Așa că ne-am uitat la toți parametrii tag .

    Finală atingere: se scoate rama cadrului. Pentru această etichetă se adaugă două parametru border = "0" frameborder = "0".


    Acum, pagina noastră va arăta astfel:

    Pro și contra de cadre

    Acum, că aveți o idee de cadre, a venit timpul să vorbim despre meritele și defectele de site-uri cu structura cadru.

    Avantajul incontestabil este reducerea cantității încărcate pe informațiile calculatorul utilizatorului. După capacul și meniurile sunt încărcate doar o singură dată, iar apoi modificați numai conținutul. Desigur, acest lucru reduce timpul de descărcare.

    Dar dezavantajele mult mai mult. În primul rând, structura de cadre ușor încurcat.

    În al doilea rând, meniul nostru este într-un fișier separat. Acest lucru înseamnă că, dacă un utilizator a găsit, de exemplu, pagina content.html printr-un motor de căutare, el poate citi numai, pentru că nici un link-uri și elemente de meniu de pe această pagină nu.

    În final, structura bazată pe cadru nu este suportat de toate browserele. Prin urmare, etichetele suschestvuyute . acestea sunt situate în interiorul tag-uri și să furnizeze informații alternative pentru browsere nu suporta frame-uri. De fapt, va trebui să efectueze o muncă dublă și de a crea două versiuni ale site-ului: cu rame sau fără ele.

    De aici concluzia - nu folosesc cadre fără a avea nevoie urgentă.

    Exemple de structuri de cadru

    După cum vă amintiți pentru separarea cadre necesită doi parametri: rânduri și COLS. Prin combinarea lor, puteți împărți fereastra în cadre în nici un fel. Exemple de astfel de partiție considerăm.


    Obținem trei cadru vertical. Lățimea primul - 150 de pixeli, al doilea - 300, iar al treilea - restul spațiului ferestrei.


    Obținem cele două cadre verticale. Lățimea primului considerată a fi unitate, iar celelalte - două ori mai mare decât primul (adică, 33% și 67% din lățimea ferestrei).


    Am obține două cadru orizontal. Înălțimea de primul - 100 de pixeli, iar al doilea - spațiul de odihnă.
    Al doilea cadru orizontal este împărțit în două verticale: o lățime de 200 de pixeli, iar al doilea va ocupa tot spațiul rămas. Acest lucru este realizat cu ajutorul tag-uri imbricate .


    Obținem cele două cadre verticale. Lățimea primului - 25%, iar al doilea - spațiul de odihnă.
    Al doilea cadru vertical este împărțit în două părți egale orizontale.

    Pe această lecție de cadre este finalizată. În lecția următoare vom face pagina noastră de muzică.

    În cazul în care acest site a fost util pentru tine, vă poate ajuta în dezvoltarea sa prin punerea una dintre aceste link-uri către site-ul tau.

    articole similare