Adresa odkazu môže byť absolútna alebo relatívna. Absolútne adresy musia začínať protokolom (zvyčajne http: //) a musia obsahovať názov lokality. Na relatívne odkazy sa odkazuje z koreňového adresára lokality alebo aktuálneho dokumentu.
Príklad 8.2 ukazuje, ako vytvoriť absolútny odkaz na inú stránku.
Príklad 8.2. Použitie absolútnych odkazov
Učenie HTML
Keď zadáte adresár lokality (napríklad http: // site / css /) ako odkaz, zobrazí sa súbor indexu. Toto je súbor, ktorý sa štandardne načíta pri prístupe k adresáru bez explicitného zadania názvu súboru. Indexový súbor je zvyčajne dokument s názvom index.html.
Absolútne odkazy sa zvyčajne používajú na označenie dokumentu na inom sieťovom zdroji, je však povolené vytvárať absolútne odkazy v rámci aktuálnej lokality. Toto sa však zriedka praktizuje, pretože takéto prepojenia sú dosť dlhé a ťažkopádne. Preto sa v rámci stránky používajú najmä relatívne odkazy.
Odkazy súvisiace s aktuálnym dokumentom
Pri vytváraní relatívnych odkazov si musíte uvedomiť, akú hodnotu zadať pre atribút href, pretože závisí od pôvodného umiestnenia súborov. Pozrime sa na niekoľko typických možností.
1. Súbory sú umiestnené v jednom priečinku (obr. 8.4).
Tento názov súboru je braný len ako vzor, na stránke by sa v názvoch súborov nemali používať ruské znaky s medzerami, a to ani v iných prípadoch.
2. Súbory sú umiestnené v rôznych priečinkoch (obr. 8.5).
Keď je pôvodný dokument uložený v rovnakom priečinku a odkazovaný dokument je v koreňovom adresári lokality, potom pred názov súboru v adrese odkazu by ste mali vložiť dve bodky a lomku (/), ako je uvedené nižšie .
Dve bodky v tomto prípade znamenajú ponechanie aktuálneho priečinka na vyššiu úroveň.
3. Súbory sú umiestnené v rôznych priečinkoch (obr. 8.6).
Teraz je zdrojový súbor v dvoch podpriečinkoch a na prepojenie s dokumentom v koreňovom adresári lokality je potrebné dvakrát zopakovať zápis z predchádzajúceho príkladu.
Odkaz
To isté platí pre ľubovoľný počet podpriečinkov.
4. Súbory sú umiestnené v rôznych priečinkoch (obr. 8.7).
Teraz sa situácia mení, zdrojový súbor sa nachádza v koreňovom adresári lokality a súbor, na ktorý sa má odkazovať, sa nachádza v priečinku. V tomto prípade bude cesta k súboru nasledovná.
Odkaz
Upozorňujeme, že pred názvom priečinka nie sú žiadne bodky ani lomky navyše. Ak sa súbor nenachádza v jednom, ale v dvoch priečinkoch, cesta k nemu je napísaná nasledovne.
Odkaz
Odkazy vo vzťahu ku koreňu lokality
Niekedy môžete nájsť cestu k súboru relatívne ku koreňu stránky, vyzerá to tak "/ Priečinok / Názov súboru" s lomkou na začiatku. Takže, vstup Kurzy znamená, že odkaz vedie do priečinka s názvom kurz, ktorý sa nachádza v koreňovom adresári stránky a do ktorého si musíte stiahnuť indexový súbor.
Upozorňujeme, že táto forma registrácie nefunguje na lokálnom počítači, ale iba pod kontrolou webového servera.
V tejto kapitole sa s vami porozprávame o odkazoch-cestách, do ktorých píšeme atribút HREF.
Všetko, čo momentálne vieme, je len šablóna:
Kotva
Pre začiatočníkov tieto znalosti stačia, pre profesionála, ktorý sa pustí do veľkého projektu, nie !!! Naozaj, vo veľkých projektoch sú sekcie, ktoré musia ísť dovnútra a von ... A potom vyvstávajú otázky, ako to urobiť a ako to urobiť správne?
Aby bolo učenie jednoduchšie, vytvoríme trojstranovú stránku s vizitkami. Keďže náš súbor index.html pre nás zatiaľ nemá žiadnu hodnotu, upravíme ho a použijeme:
Naše kontakty
Ďalej vytvoríme súbor delo.html, v ktorej vám povieme o našich službách:
Naše kontakty
A tiež vytvorte súbor kontakt.html, pre kontakty s nami:
Naša ponuka
Teraz sa pozrime (otvorí sa na novej karte), čo máme.
Na týchto príkladoch som chcel ukázať, že všetko funguje. Ale, jeden veľký ALE, odkazujeme priamo na súbory, ale cesty nie sú viditeľné ...
Tak to je relatívna cesta, t.j. cesta je relatívna k referenčnému súboru, ale samotná cesta nie je viditeľná, pretože všetky naše súbory sú v rovnakom adresári (priečinku).
V našom tréningovom priečinku (my_site) si vytvoríme ďalší priečinok s názvom razdel a už v ňom vytvoríme nový súbor s názvom index.html... Ako v tomto prípade vložiť odkaz z našich súborov, ktoré sme vytvorili vyššie?
razdel / index.html ">
A ak v priečinku razdel vytvorte priečinok podrazdel potom cesta už bude z koreňového priečinka:
razdel / podrazdel / index.html "> podsekcia
a z priečinka razdel
podrazdel / index.html "> podsekcia
Upozorňujeme, že oddeľovač medzi priečinkami a / alebo súbormi je "predbežná lomka" (lomka).
Naučili sme sa, ako zadávať priečinky, teraz sa pozrime, ako ukončiť:
Ak chcete nechať priečinok podrazdel v razdel, musíte pridať do cesty ../
, táto znaková sada informuje prehliadač, že požadovaný súbor je o úroveň vyššie:
../index.html"> Späť do sekcie
Ak sa chcete vrátiť na 2 úrovne, napíšte túto kombináciu dvakrát:
../../
index.html "> návrat do koreňového adresára lokality
Teraz navrhujem pozrieť sa na absolútne cesty. Absolútna cesta toto je cesta k súboru vrátane názvu lokality a protokolu (http alebo https). Predstavme si, že náš priečinok moja_stranka a existuje koreň lokality a názov lokality je my_site.ru, v tomto prípade bude absolútna cesta:
http://my_site.ru alebo http://my_site.ru/ alebo http://my_site.ru/index.html
Zatiaľ čo absolútna cesta k priečinku je razdel
http://my_site.ru/razdel alebo http://my_site.ru/razdel/ alebo http://my_site.ru/razdel/index.html
Aké sú najlepšie spôsoby použitia? Absolútne!!! Existuje však možnosť urobiť chyby, pretože tieto odkazy smerujú na konkrétnu stránku a lokálne (bez servera) nemôžeme tieto chyby opraviť ...
A ešte raz, pokiaľ ide o hlavnú stránku, nevkladajte odkaz my_site.ru, pretože prehliadač bude stále presmerovať na my_site.ru/, to znamená, že dôjde k presmerovaniu (presmerovaniu) a vyhľadávače príliš nemajú radi presmerovania.
Tiež nikdy neuvádzajte odkaz my_site.ru/index.html, pretože toto je dvojka pre my_site.ru/ a z pohľadu vyhľadávačov sú to dve rozdielne stránky a v tomto prípade dochádza k duplicite obsahu, čo vyhľadávače nerešpektujú. Takže správny odkaz pre absolútne je: my_site.ru/ a pre relatívne z toho istého priečinka: /
alebo zostupy: ../
... A ak používate absolútne cesty, musíte sa rozhodnúť, ako napísať adresu (s alebo bez www), všetko je tu tiež jednoduché, ak máte osobný (dedikovaný) server, potom bez a ak si prenajímate iba časť servera, potom s www .
Adresa odkazu môže byť absolútna alebo relatívna. Absolútne adresy musia začínať protokolom (zvyčajne http: //) a musia obsahovať názov lokality. Na relatívne odkazy sa odkazuje z koreňového adresára lokality alebo aktuálneho dokumentu.
Príklad 8.2 ukazuje, ako vytvoriť absolútny odkaz na inú stránku.
Príklad 8.2. Použitie absolútnych odkazov
Učenie HTML
Keď zadáte adresár lokality (napríklad http: // site / css /) ako odkaz, zobrazí sa súbor indexu. Toto je súbor, ktorý sa štandardne načíta pri prístupe k adresáru bez explicitného zadania názvu súboru. Indexový súbor je zvyčajne dokument s názvom index.html.
Absolútne odkazy sa zvyčajne používajú na označenie dokumentu na inom sieťovom zdroji, je však povolené vytvárať absolútne odkazy v rámci aktuálnej lokality. Toto sa však zriedka praktizuje, pretože takéto prepojenia sú dosť dlhé a ťažkopádne. Preto sa v rámci stránky používajú najmä relatívne odkazy.
Odkazy súvisiace s aktuálnym dokumentom
Pri vytváraní relatívnych odkazov si musíte uvedomiť, akú hodnotu zadať pre atribút href, pretože závisí od pôvodného umiestnenia súborov. Pozrime sa na niekoľko typických možností.
1. Súbory sú umiestnené v jednom priečinku (obr. 8.4).
Tento názov súboru je braný len ako vzor, na stránke by sa v názvoch súborov nemali používať ruské znaky s medzerami, a to ani v iných prípadoch.
2. Súbory sú umiestnené v rôznych priečinkoch (obr. 8.5).
Keď je pôvodný dokument uložený v rovnakom priečinku a odkazovaný dokument je v koreňovom adresári lokality, potom pred názov súboru v adrese odkazu by ste mali vložiť dve bodky a lomku (/), ako je uvedené nižšie .
Dve bodky v tomto prípade znamenajú ponechanie aktuálneho priečinka na vyššiu úroveň.
3. Súbory sú umiestnené v rôznych priečinkoch (obr. 8.6).
Teraz je zdrojový súbor v dvoch podpriečinkoch a na prepojenie s dokumentom v koreňovom adresári lokality je potrebné dvakrát zopakovať zápis z predchádzajúceho príkladu.
Odkaz
To isté platí pre ľubovoľný počet podpriečinkov.
4. Súbory sú umiestnené v rôznych priečinkoch (obr. 8.7).
Teraz sa situácia mení, zdrojový súbor sa nachádza v koreňovom adresári lokality a súbor, na ktorý sa má odkazovať, sa nachádza v priečinku. V tomto prípade bude cesta k súboru nasledovná.
Odkaz
Upozorňujeme, že pred názvom priečinka nie sú žiadne bodky ani lomky navyše. Ak sa súbor nenachádza v jednom, ale v dvoch priečinkoch, cesta k nemu je napísaná nasledovne.
Odkaz
Odkazy vo vzťahu ku koreňu lokality
Niekedy môžete nájsť cestu k súboru relatívne ku koreňu stránky, vyzerá to tak "/ Priečinok / Názov súboru" s lomkou na začiatku. Takže, vstup Kurzy znamená, že odkaz vedie do priečinka s názvom kurz, ktorý sa nachádza v koreňovom adresári stránky a do ktorého si musíte stiahnuť indexový súbor.
Upozorňujeme, že táto forma registrácie nefunguje na lokálnom počítači, ale iba pod kontrolou webového servera.
11.01.07 44,5 tisAko viete, v parametri href značky (
Mnoho ľudí píše niečo ako http://somesite.ru/catalog/doc.html. Áno, nikto sa neháda, funguje to. Je tu však jedno „ale“. Pozrime sa na príklad.
Nechajte svoju stránku hostiť napríklad na nejakom bezplatnom hostingu a jej adresa bola nasledujúca: http://fsite.freehosting.ru.
Na serveri je asi 100 dokumentov. A tak ste sa rozhodli presunúť svoje stránky do inej domény,
nech je to platený hosting v zóne ru: http://site.ru. Teraz všade zmeniť http://fsite.freehosting.ru na http://site.ru?
Áno, vďaka redaktorom, ako je homesite, je to možné. Toto však nie je možné.
Predpokladajme, že pred nahraním stránky na server skontrolujete jej funkčnosť.
na vašom domácom serveri Apache (pre tých, ktorí ešte nevedia, čo je to „domovský server“ - tu (Inštalácia a konfigurácia servera Apache) a namiesto http: // localhost budete musieť napísať http://site .ru všade. Súhlasím, prinajmenšom nepríjemné.
Riešením je, že pri zadávaní cesty k súboru neberte do úvahy jeho polohu na stránke, ale polohu na serveri.
Absolútna cesta
Vezmite si napríklad súbor doc.html, ktorý sa nachádza na adrese: http://somesite.ru/catalog/doc.html. Ako viete, server obsahuje priečinok www. Ako vidíme z adresy, tento priečinok obsahuje priečinok katalógu a už obsahuje súbor doc.html.
Ak pri zadávaní cesty k súboru umiestnite pred adresu /, bude to podobné ako v nasledujúcom: koreňový_adresár_na_severe / www / cesta k súboru.
To znamená, že http://somesite.ru/catalog/doc.html je podobné nasledujúcemu: /catalog/doc.html.
Takže, keď je pred adresou /, znamená to, že "počítanie" začína z adresára www.
Teraz namiesto http: //localhost/index.html z akéhokoľvek dokumentu môžete napísať /index.html.
Ale aby ste sa dostali do adresára cgi, musíte napísať takto: / cgi-bin / cesta k súboru.
Cesty vytvorené vyššie opísanými metódami sa nazývajú absolútne, pretože je uvedená absolútna (úplná) cesta k súboru na serveri.
Relatívna cesta
Existujú aj relatívne cesty, ktoré sú relatívne k samotnému dokumentu, z ktorého je odkaz.
Ak napríklad vytvoríte odkaz newcat / new.html v doc.html, znamená to, že súbor new.html sa nachádza v adresári newcat, ktorý sa zase nachádza v rovnakom adresári ako súbor doc.html . Ako vidíte, táto cesta je relatívna k súboru doc.html. Kdekoľvek sa tento súbor nachádza, cesta newcat / new.html bude vždy pravdivá, ak sú súbor doc.html a adresár newcat na rovnakej úrovni (t. j. v rovnakom adresári).
V porovnaní s niektorým dokumentom môžete ísť v adresári nahor. Ak to chcete urobiť, musíte napísať ../.
Napríklad existuje veľký adresár, ktorý obsahuje dva adresáre: primárny a sekundárny. Primárny adresár obsahuje už známy súbor doc.html; a sekundárny adresár obsahuje súbor new.html. Ak chcete vytvoriť odkaz na súbor new.html zo súboru doc.html, musíte napísať ../secondary / new.html. Ale ak sa veľký adresár nachádza v adresári www, potom cesta k súboru new.html môže byť špecifikovaná takto: /big/secondary/new.html
V tomto návode vysvetlíme začiatočníkom, čo je absolútna a relatívna cesta k súboru a v takom prípade je lepšie použiť ktorú. Ak ste už oboznámení s touto témou, môžete prejsť na ďalšiu lekciu.
Začnime teda definíciou samotného pojmu „cesta“:
Cesta (anglická cesta) - množina znakov zobrazujúcich umiestnenie súboru v súborovom systéme, adresa adresára.
Wikipedia
Ak hovoríme o stránkach, potom je cesta rovnaká ako odkaz. Odkazy môžu byť absolútne alebo relatívne. Zvážme obe možnosti podrobnejšie.
Čo je absolútna cesta k súboru
https://www.google.com/images/branding/googlelogo.png
V CSS je možné použiť absolútnu cestu. Ak chcete napríklad nastaviť obrázok ako pozadie, môžete použiť absolútnu adresu URL súboru obrázka A určiť ju vo svojej šablóne so štýlmi:
Obrázok na pozadí: url (http://www.example.com/img/bg.png);
Čo je relatívna cesta k súboru
S relatívnou adresou je všetko oveľa zaujímavejšie - dá sa počítať z koreňa stránky aj z aktuálneho dokumentu. Relatívna cesta koreňa je cesta, ktorá ukazuje na umiestnenie súboru vzhľadom na koreňový adresár lokality. V tomto prípade adresa neobsahuje žiadny protokol ani názov domény a začína lomkou /, ktorá označuje koreňový priečinok. Táto adresa vyzerá takto:
Obrázok na pozadí: url (/img/bg.png);
Aké ľahké je určiť koreňovú relatívnu adresu? Stačí vziať absolútny odkaz a odstrániť z neho protokol a názov domény, pričom ponechajte lomku a všetky nasledujúce znaky.
Relatívna cesta k súboru z dokumentu je cesta k súboru vzhľadom na aktuálny dokument. Táto adresa závisí od umiestnenia súboru, v ktorom je zapísaná. Napríklad, keď je v hárku štýlov zadaný relatívny odkaz, vypočíta cestu k súboru na základe hárku štýlov a nie podľa aktuálnej webovej stránky alebo koreňového priečinka. Tu je niekoľko príkladov.
Príklad I
Ak sa naša šablóna so štýlmi style.css a súbor obrázka na pozadí bg.png nachádzajú v rovnakom priečinku (nie nevyhnutne v koreňovom adresári), potom bude relatívna cesta z tabuľky k obrázku vyzerať takto:
Obrázok na pozadí: url (bg.png); / * stačí napísať názov súboru * /
Príklad II
Ak je šablóna so štýlmi v koreňovom adresári a obrázok je v priečinku img, relatívny odkaz by bol:
Obrázok na pozadí: url (img / bg.png); / * bez úvodnej lomky * /
Príklad III
Ak je predloha štýlov v priečinku a obrázok susedí s týmto priečinkom, potom bude relatívna cesta vyzerať takto:
Obrázok na pozadí: url (../ bg.png); / * dve bodky – posun o úroveň vyššie * /
Príklad IV
Ak je predloha štýlov v dvoch priečinkoch a obrázok susedí s prvým priečinkom, potom bude relatívna cesta takáto:
Obrázok na pozadí: url (../../ bg.png); / * ísť o dve úrovne vyššie * /
Dve bodky a lomka na začiatku relatívnej cesty znamenajú prechod o jednu úroveň vyššie. V závislosti od počtu úrovní (katalógov), do ktorých sa potrebujete vyšplhať, je potrebné zaregistrovať požadovaný počet bodiek s lomkou. Ak sa napríklad šablóna štýlov nenachádza v dvoch, ale v štyroch priečinkoch, záznam bude takýto:
Obrázok na pozadí: url (../../../../ bg.png);
V prípade, že je obrázok skrytý v priečinku img a šablóna so štýlmi je v priečinku css, budete musieť opustiť priečinok css a prejsť do priečinka img. Páči sa ti to:
Obrázok na pozadí: url (../ img / bg.png);
Ak existuje niekoľko priečinkov, musíte ich tiež zaregistrovať. Zmeňme predchádzajúci príklad: povedzme, že v priečinku img je ďalší priečinok pozadia, ktorý obsahuje náš výkres. Relatívna cesta bude vyzerať takto:
Obrázok na pozadí: url (../ img / pozadia / bg.png);
Ktorý spôsob je lepšie použiť
Absolútna adresa odkazu bude potrebné použiť, ak sa súbor, na ktorý odkazujete, nachádza na inej lokalite. V rámci toho istého webu sa absolútna cesta prakticky nepoužíva (aj keď bude fungovať). Je to spôsobené niekoľkými bodmi: po prvé, takéto odkazy môžu byť veľmi ťažkopádne a po druhé, ak sa zmení názov domény, vznikne problém - všetky odkazy povedú na starú doménu, čo môže viesť k mnohým chybám a nefunkčným odkazom.
Relatívna cesta koreňa bude fungovať na webovom serveri, ale pri vývoji na lokálnom počítači je to zbytočné. Výhodou tohto typu odkazu je však to, že svoj štýl môžete presunúť do ľubovoľného priečinka na stránke a nemusíte sa báť, že adresy URL obrázkov na pozadí budú nefunkčné.
Relatívna cesta z dokumentu- najlepšia možnosť pre vývoj webu na lokálnom počítači bez použitia servera. V prehliadači budete môcť normálne prezerať webové stránky uložené v počítači a adresy súborov budú fungovať. Budú fungovať na živej stránke, ale s jednou podmienkou – ak nepresuniete šablónu so štýlmi na iné miesto (inak budete musieť upraviť cesty).
Skúste si precvičiť používanie relatívnych ciest na lokálnom počítači aj na webovom serveri. Pochopenie toho, ako to funguje, sa určite hodí pri každom projekte.
Ďalej v návode: vlastnosť background-repeat – ovláda opakovanie obrázka na pozadí.
Pomer strán 1440 x 900
Rozlíšenia obrazovky monitora
Kedy potrebujem aktualizovať firmvér
Ako premeniť smartfón s Androidom na bezpečnostnú kameru
Ako vyzerá čínska klávesnica (história a fotografie)