Helló, kedves blogolvasók honlapja. Ban, megpróbáltam elkezdeni az ő elveiről beszélni, de sajnos nagyon meg kellett volna vonulnia a webmester alapfogalmának magyarázata.

Tényleg nem akartam körbejárni ezeket az alapvető dolgokat, és nagyon sajnálom, hogy azok, akik már mindent tudtam, de pontosan azt akartam hallani a beszélgetést, és nem hallottam.

Ebben a cikkben megpróbálok elkapni és helyesbíteni. Remélem, hogy nem kell sokáig eltérni a fő témáról. Nos, bocsánatkéréssel és bűnbánatával feltételezzük, hogy véget ért, és itt az ideje, hogy végül közvetlenül az ügyre lépjen.

Hozzon létre egy webhely elrendezést a DIV elrendezéseken alapuló 2 oszlopban

Tehát, az előző cikkben hoztunk létre a tárhely (bár erre a célra, elég egy e-mailt annak képességeit) A teszt mappát, amelyben két fő fájlokat jövőnk elrendezés került: index.html és style.css. Valójában meg fogják tenni a legegyszerűbb lehetőség Keret.

Ismét, valószínűleg el kell vetnie egy kicsit az azonnali elrendezéstől, mert Nem mindenki lehet törölni, hogyan lehet létrehozni egy tesztmappát az igazi tárhelyen található gyökérkönyvtárban. És azt is, hogy - a helyszín gyökere és hol keresse meg az FTP elérésekor. De valójában a kérdés nem triviális a felhasználó számára, aki először találkozott a hostingjével.

Tehát először csatlakozni kell az FTP protokollon keresztül. Az FTP-hez való csatlakozásra vonatkozó adatoknak tájékoztatniuk kell a hosting szolgáltatót (általában olvasható, A).

Miután csatlakozott az FTP-hez (a Filezilla programot erre a célra használom, az egész igazságot írták róla, és ez példáján lesz, hogy mindent elmondjon), majd a program megfelelő ablakában látni fogja a tartalmát A katalógus, hogy a Hoster hozzászaja a webhelyeit, szkriptjeit és hasonló dolgokat.

De ez a könyvtár nem lesz gyökérmappa. Az index.php fájlnak a gyökérben kell lennie, valamint minden más fájlt és mappát, amelyet a motort használ.

Ebből a célból külön könyvtárat használnak, bár annak neve, az adott tárhelytől függően eltérő lehet. A belső mappák szerkezete a fő könyvtárban (nyitva az FTP-helyhez való csatlakozáskor) is eltérhet, de a lényeg ugyanaz marad.

Például a következő képet láthatja:

Mozgassa a fájlokat, amelyeket nem kell másolnia a legtöbb felső könyvtárba az Ön számára az FTP-en, és az úgynevezett root mappában. Hogyan lehet megtudni, melyik könyvtár jelen van, gyökér van?

Nos, a szélsőséges esetben megkérdezheti a legtöbb tulajdonosát a tárhely. És mi, kötelesek segíteni az ilyen ügyekben. De valójában leggyakrabban hívják vagy Public_HTML vagy htdocs.

Ha nem talál ilyen könyvtárakat, akkor meg kell kérdeznie a tárhely kérdését, és ha van olyan, mint a raktáron, akkor ez a hírhedt gyökér És benne van, hogy meg kell teremtenie a hosszú szenvedő teszt mappát, amelyre írtam, és remélsz, hogy elolvasod ezeket a néhány bekezdéseket.

Hogyan készítsünk egy könyvtárat a FileZilla program segítségével? Igen, nagyon egyszerű. Elég lesz ahhoz, hogy megnyitjon egy ló könyvtárat a jobb oldalon, és kattintson egy üres helyre a jobb egérgombbal, és válassza a Katalógus elem létrehozása a helyi menüből.

UV, létrehozta a teszt mappát a webhely alapkatalógusában. És köszönöm. Általában lehetséges volt, hogy ne zavarjon vele. Hogy hogy? Így. A tesztkönyvtár létrehozható néhány belső weboldal mappában, de még mindig gyökér lesz.

A helyi kiszolgálóhoz a Denver meg kell hoznia a tesztkönyvtárat a következő könyvtárban:

C: Server LocalHost \\ www \\

A "C" lemez helyett meg kell adnia a számítógépen lévő lemezt, ahol a helyi kiszolgáló telepítve van. Azután, hogy megtekinthesse az általunk létrehozott elrendezés elrendezést a DIV elrendezés alapján 2 oszlopban, meg kell tárcsáznia a következő útvonalat a böngésző címsorában:

Http: // localhost / teszt /

A fenébe, ha minden olyan részletes, akkor egy kis könyvet fog kideríteni a blokk elrendezéséről, és a legtöbbet a webmester alapjaira fordítják, de nem tudok másképp írni, szoktam szerezni a polcok összes árnyalatát. Ne hagyja jóvá, elég hozzáértő webmesterek, amelyek mindez nem újdonságban van.

Folytassa a beszélgetést az elrendezésről. Az index.html fájlban maguk is meghatározzuk a DIV konténereket, amelyeken a keretünk épül, és a stílusban.css fájlban - írja le a pozíciót és megjelenés Ezek a div tartályok. Ez egy dióhéjban van, és hogyan fogja valójában, látni fogsz egy kicsit az időjárást.

Annak érdekében, hogy megfigyeljük munkáink eredményeit a böngészőben, rendszeresen kapcsolatba lépünk a böngésző címsorához a hosting vagy on helyi szerver. Real host esetén a böngésző címsorában valami ilyesmit kell szereznie:

Https: // webhely / teszt

De két "de" van. Először is, a https: // weboldal helyett / be kell mutatnia az URL-jét, és másrészt figyelni kell a latin betűkre, amelyek a tesztkönyvtár nevét alkotják.

Ha a mappa nevét nagybetűkkel írta, akkor a címsorban be kell írnia a címmappát (itt írtam a nagybetűs tesztet, csak annak érdekében, hogy kiemelje a fennmaradó szöveg hátterét).

Az a tény, hogy a legtöbb esetben a valódi tárhelyen a kiszolgáló UNIX hasonló operációs rendszer, ahol a tőke és a kisbetűk eltérnek egymástól (Ellentétben az ablakokkal, amelyekkel megszoktuk őket).

A webhely verstaste elrendezését 2 oszlopban a diva-on

Amint már említettem, kezdeni, megpróbálunk két oszlopban elrendezést létrehozni, amelyek a következőképpen vázlatosan képezhetők:

Minden elemet egy nagy DIR konténerbe helyezünk, így megváltoztathatja a méretét és összehangolhatja az egész elrendezést a tartály tulajdonságai révén. A Main DIR belsejében olyan konténerek lesznek, amelyek felelősek az egyes blokkok (sapkák, bal oszlop, tartalomtartalom területek, fordulat) kialakításáért.

Megkérdezzük tőlük a méreteket és konfiguráljuk a helymeghatározást az oldalon a CSS használatával.. Tehát folytassa.

Kezdjük az index.html-vel. Nyissa meg a szerkesztést egy kényelmes szerkesztőben (használom erre a célra a legjobb szabad szövegszerkesztők Notepad ++ -).

Annak érdekében, hogy hozzászokjunk a HTML-dokumentumok helyes kialakításához, azonnal adjuk meg a szabványos részt (csak az előző cikkben maradtam. Van egy doctype () és minden más felső címke, amely a böngésző hiánya esetén hozzáadhatja magukat (Smart ők lettek - horror):

Az előző cikkben részletesen részletesen kifejtettem az előző cikkben az előző cikkben (lásd a jelenlévő linket a kiadvány kezdetén), így most csak a sorban lakik:

Ez a vonal megmutatja a böngészőnek, hol keresse meg és mi a neve a kaszkád stílusú táblázatfájl (a CSS kiterjesztés), amely a böngészőhöz szükséges a jövőbeni site sablon kialakításának helyes megjelenítéséhez. A mi esetünkben stílusos.css (), és ugyanazon a mappában kell keresni, ahol az index.html fekszik (amelyben ezt a vonalat kimondja).

Miért pontosan ugyanabban a mappában? Mivel ha semmilyen módon nem írja elő a fájlt (csak a nevét jelölje), akkor a böngésző ugyanazon a könyvtárban keresi azt, ahol a végrehajtható (a mi esetünkben index.html). Azok. Az út hiánya egyenértékű lesz azzal, hogy ha a stílushoz írnám.

De a felvétel első változata rövidebb és univerzálisbb, mert Ez közvetlenül nem jelzik az utat, hogy a mappát a fájlok, amelyek segítségével helyezze a index.html és style.css fájlokat egy másik könyvtárba, kapcsolat a index.html a címsorba, és még mindig lesz betöltve a style.css . Tudjon meg többet a relatív és abszolút linkekről).

Ebben a tekintetben azt szeretném megjegyezni, hogy általában nem zavarhatja a tárhelyet vagy a helyi kiszolgálót. Egyszerűen készítse el a számítógépet Bármely mappa, és helyezze el az index.html és style.css. Írja be az elsőt a stílust.css fájlba az űrlapon:

És ez az. Most már megnyithat egy index.html-t (duplán kattintva) az alapértelmezés szerint rendelt Brawserben, hogy megnyitja a fájlokat a HTML kiterjesztéssel a számítógépen, és a stílus.css automatikusan betöltődik.

Ez a módszer kényelmes a képzési szakaszban, de mégis, mindazt, amit beszéltem veled egy igazi hosting vagy helyi kiszolgáló munkájáról, akkor is hasznos lesz a jövőben is. És most a számítógép mappájából dolgozik, még kényelmesebb lehet, mint a tárhelyen. Bár, ki van.

A kívánt blokkok készletét írjuk elő az index.html-ben

Most négy DIR konténert kell létrehoznunk a 2 oszlop elrendezésének minden részéhez (sapkák, bal oldali oszlop, tartalom, lábszár), és adja meg őket egy nagy div.

A DIV-konténerek belsejében az elrendezés részeihez a láthatóság érdekében lezárható a blokkok neve. Mindezek megírjuk a nyitás és a zárás között HTML-címkék Test. Kiderül valami, mint a kód az index.html-ben:

Azok. Közvetlenül a test megnyitó címkéjén, előírtunk a fő div elrendezõtartály nyitó címkéjét: