Internet, Spletno oblikovanje

Kaj je okvir? Struktura in ustvarjanje okvirjev

Okvir je območje na mestu (oknu), v katerem je vidna druga spletna stran. Spletne učitelji to priložnost izkoristijo za predstavitev glavne strani spletnega mesta svojih prijateljev ali partnerjev. Ista tehnika se uporablja za prikaz obrazca za iskanje v oknih in njegovih rezultatih, in tako naprej.

Toda v osnovi se okvirji uporabljajo za ustvarjanje velikih spletnih portalov, kjer je potrebno veliko menijskih postavk in podmenijev. O tem običajno pravijo: "mesto na okvirjih." Če želite ustvariti tak vir, je dobro znanje jezika HTML.

Ustvarjanje okvirjev v graditelju strani

Nekateri oblikovalci spletnega mesta zagotavljajo samodejno generiranje takšne kode. Ponavadi je gumb za dodajanje okvirja v glavnem meniju programa. Najprej morate kazalec postaviti na pravo mesto na strani, nato kliknite gumb, odprlo se bo okno (kot je prikazano na sliki). V njej lahko nastavite naslov strani, ki se bo odprla v okvirju, in prilagodite dimenzije: širino in višino.

Toda v osnovi se okvirji uporabljajo za ustvarjanje velikih spletnih portalov, kjer je potrebno veliko menijskih postavk in podmenijev. O tem običajno pravijo: "mesto na okvirjih." Če želite ustvariti tak vir, je dobro znanje jezika HTML.

S pomočjo te "storitve" je na strani mogoče ustvariti več okvirjev, to so samo medsebojno povezani elementi, tako da jih ne boste dobili.

Okvirji v CMS

V številnih programih za izdelavo spletnih strani je mogoče namestiti ustrezen modul. Na primer, za okvir Joomla, to je modul "Omotač".

V nadzorni plošči CMS Jumla je mogoče najti in ustvariti: "Razširitve" - "Upravitelj modulov" - "Ustvari" (okrogli gumb oranžne barve z znakom plus). V pojavnem oknu se na seznamu prikaže modul "ovitka".

Če ni tukaj, potem ni vključen. Če ga želite uporabiti, ga morate najprej aktivirati: zavihek »Razširitve«, nato »Nadzornik razširitve«, nato zavihek »Upravljanje«. In poiščite seznam, ki se odpre, lahko v polje »Filter« vnesete besedo: Ovojnik za hitro iskanje. Nasproti tega modula mora biti zelena ikona s klopjo znotraj. Rdeči krog z dotikom znotraj bo pokazal, da je ta vtičnik izklopljen.

Po tem postopku se lahko vrnete na »Upravitelj modulov«, ustvarite okvir in nastavite njegove parametre.

Kot je prikazano na sliki, modul omogoča nastavitev: glava nad okvirjem, položaj modula, izberite strani mesta, na katerem bo prikazano. In tudi prilagodite širino, višino; Dodajte okvir in dejansko povezavo na spletno stran. Če želite v okvirju prikazati glavno stran spletnega mesta v polni širini, potem privzeto nastavite 100%. Lahko ga takoj shranite 400%. Nadmorska višina 200 navadno zadostuje za prikaz zgornjega menija strani. Vse ostale vsebine bodo vidne, če uporabnik (obiskovalec spletnega mesta) uporabi drsni trak.

Tukaj je primer, kaj je okvir v Jumli.

Modul Jumla za izdelavo okvirja je zelo priročen in enostaven za uporabo. Vendar pa so njegove zmogljivosti omejene, kot tudi zmožnosti oblikovalca.

Zgodovina in realnost

V praksi ustvarjanja spletnih mest iz okvirjev se ta oznaka (njegova aplikacija) že zdavnaj umakne v ozadje. Zamenjali so module, nastavitve v programih graditelja, ki ustvarjajo kodo za spletno stran brez sodelovanja graditelja spletnega mesta. Vendar v nekaterih primerih to ni dovolj. Na primer, kadar je okvir celovita kompleksna struktura iz območij, prikazanih v brskalniku. Tako njihovi lastniki vidijo kompleksnost strukturiranih spletnih mest. Ob nastanku so le v skrajnih primerih, ker so Frameyove strani ustvarjene izključno s pomočjo specializiranih oznak.

Kompleksno strukturirane lokacije

Za njih je ustvarjanje več med seboj povezanih okvirov optimalna rešitev za organiziranje vsebin na straneh vira. To praviloma velik portal, ki vsako leto narašča.

Kako doseči enak rezultat? Kako ustvariti strukturo okvirja?

Kako napisati okvir v kodo strani

Okvirji v HTML se dodajajo z uporabo oznak:

  • Frame (za eno okno);
  • Frameset (s pomočjo nje se ustvari celotna struktura);
  • Iframe ("plavajoči" okvir);
  • Št okvirjev (če okvir ni prikazan v brskalniku uporabnika).

Prva določena oznaka se vedno prilega v par in . In nadomešča in . S pomočjo ustreznih atributov lahko prilagodite značilnosti vsakega elementa: ime (ime =), velikost (cols = in vrstice =), mejo (mejo), drsnik in seveda povezavo do spletne strani za prikaz.

Različice oblikovanja

Celotno stran mesta lahko razdelimo na področja. Na primer:

Levo

Zgornji okvir

Prav

To strukturo (imenovanega gnezda) je mogoče dobiti z nastavitvijo atributa cols znotraj oznake, ki označuje vodoravni položaj okvira in vrstice - navpično. Naslednji je znak = in dimenzije so napisane. Na primer, 60%, 40% - odstotek (eno okno bo potrebovalo 60% prostora brskalnika, drugo pa 40%). Ali 100, 200 - razmerje velikosti v slikovnih pikah. Velikosti enega od okvirjev sploh ni mogoče nastaviti (privzeto bo nameščen). Za to morate določiti * za vejico ali za vejico.

V tem paru frameset registrira vsak okvir s parametri: src = http: // stran / članek / 143778 /% 2C, potem je v narekovajih podana povezava s spletno stranjo in ime = z glavo (na primer, okvir 1).

Gnezdenje vsakega novega območja je označeno z novim okvirjem.

Primer koda:

Upoštevajte, da je v našem primeru za okvire druge in tretje dimenzije napisan samo en čas.

Veliko zadumok vam omogoča izvajanje okvirov. Primeri njihove lokacije v oknu brskalnika se lahko prinese neskončno (ustrezno spremeni kodo). Vendar pa ti podatki niso bili dolgo časa uporabljeni. Okvirji, če se uporabljajo danes pri ustvarjanju spletnih mest, nato pa samo kot moduli v brezplačnem CMS ali v obliki iframe.

Plavajoči okvir

Čudno je, zakaj je dobil to ime, beseda "vgrajena" je bolj primerna tukaj. Ta okvir je ustvarjen za prikaz vsebine datoteke. Naložite v zbirko podatkov kateri koli dokument ali datoteko, uporabite oznake ayframeja, da prijavite pot do nje - obiskovalci bodo videli besedilo datoteke (video ali sliko). Na žalost brskalniki ne prikazujejo vedno vsebine. Če želite to narediti, spletni razvijalci vnesete besedno zvezo med začetno in zaprite oznako: »Vaš brskalnik ne prikazuje vsebine.«

Na primer, Seopult.ru je dobro znana služba za promocijske mojstre. Ni njegovo primarno spletno mesto, ampak ogledalo I.seopult.pro, ustvarjeno za portalske stranke. Koda ayframa je tukaj napisana:

  • Navodila . Kjer je ustvarjena oznaka
  • za določitev elementa seznama. Podpirajo ga vsi brskalniki.

    Na strani samega ogledala si lahko ogledate besedo "Navodilo" v obliki gumba. Ko kliknete na njo, se v središču okna brskalnika odpre predstavitev.

    Vse glavne strani za gledanje filmov in serijskih filmov so ustvarjene s pomočjo ayframov (na primer "Imhonet") in socialnih omrežij. Tudi glavna stran »Yandex« vsebuje to oznako in ne en par.

    Kako predpisati iframe

    Naložite na spletno stran dokument v obliki okna z drsnim trakom lahko kjerkoli. Običajno so oznake nameščene znotraj telesa. Poleg standardnih

    in , kot je prikazano v zgornjem primeru, lahko uporabite tudi seznam oznak

  • .

    Atributu dodamo atribute:

    • Širina (širina) in višina (višina =);
    • Poravnava na poravnavi robov;
    • Ujemanje, ki ga ne morete predpisati: privzeta vrednost je 6 - to je dovolj;
    • Z omogočanjem transparentnosti lahko nastavite preglednost območja okvirja tako, da je vidna ozadje strani;
    • Plus že poznani scr, ime, pomikanje, meja.

    Navigacija s pomočjo letala

    Najbolj zanimiva spretnost pri ustvarjanju okvirjev je pisanje kode, ki vam omogoča, da odprete vsebino v oknu s sklicevanjem, nekaj, kar so ustvarjalci ogledala Seopult naredili, takoj takoj z več povezavami (hkrati na voljo uporabniku na eni strani).

    V ta namen se vzpostavi ayframe, v njem pa je tudi ime po imenu = dodatno registrirano. Na primer, zagolovok. Naslednje pred tem v oznakah in , so podane povezave po HREF = http: // stran / članek / 143778 /% D1% 81, ki jim sledi atribut cilj = zagolovok. Pred uporabo zapiralne oznake se prikaže napis, ki bo služil kot povezovalni gumb. Oznake »a« se odprejo in zaprejo v p-oznaki.

    V kodi je več vrstic, ki jih lahko uporabite za pridobitev več gumbov v vrstici na spletnem mestu, s klikom na katero različico vsebine boste prikazani v spodnjem oknu.

    Koda bo videti tako:

    Objavite svoj oglas

    Oglejte si oglase