Hogyan készítsünk HTML oldalt a jegyzettömbben

HTML webhely létrehozása egy notebookban a semmiből

Ha a webhely egy vagy több oldalból áll, és a közeljövőben nem lesz tele tele sok tartalom, vagy kitalálni a komplex funkcionalitást (online áruház, termékkatalógus, fórum stb.). Ezután hozzon létre egy ilyen webhelyet a HTML-en a notebookban.

1. Ehhez szükséged lesz a saját termelésünk helyére, vagy letöltötte a PSD forráshálózatról. A HTML elrendezéshez kell vágnia.
2. Notepad, nevezetesen jegyzettömb++. A hivatalosan letölthető.
3. A HAB fájl létrehozható bármely kényelmes mappában a számítógépen. De jobb volt beállítani egy külön mappát a webhelyére, és helyezze ott. Nekem van ez a mappa C: \ site \ Hab
4. Fájl C: \ site \ Hab egy stílusfájl, miért kell majd egyértelmű lesz később.
5. C mappa C: \ Site \ Képek. Ebben a mappában meg kell helyezni az összes szükséges képet a jövő webhelyéhez.
6. Vásároljon hosting és domain, ha be kell küldeni az interneten

A kényelem érdekében archívumot készítettem, és már készen állt üres Hab és Hab fájlok letöltése és kicsomagolva az archívumot a szükséges mappában.

A webszerver szüksége van egy webszerverre. A szerver, amikor egy domain vagy a webhelymappát, anélkül, hogy megadná az adott fájlt, megtalálja a Hab vagy a Hab-ot, ha nem találja a mappák listáját.

Mivel egy egyszerű HTML oldalunk van, nem kell telepíteni a kiszolgálót a számítógépünkre, mivel a jelölőnyelv megérti a böngészőt. Ha azonban PHP-t kell használnia, akkor csak egy böngésző már nem történik meg.

Most meg kell nyitnia az index és stílusfájlt a jegyzettömbben++

HTML dokumentumszerkezet

Másolja a kódot a Hab fájlba

!DOCTYTYT HTML Nyilvános “- // W3C // DTD XHTML // HU” Hab “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “cím Fejlap a böngészőhöz / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest h1 oldal / h1 !– Megjegyzés – Pabzac./ P / test / html

Most nyissa meg a böngészőben, így kell működnie:

Röviden leírom, hogy ezek a címkék mit jelentenek. Ha többet szeretne kitalálni a Googl-ről, és a témáról szóló információkat mondják.

Megadjuk a böngészőt, amely szerint az oldal megjelenítéséhez szükséges szabvány:

!DOCTYTE HTML Public “- // W3C // DTD XHTML // HU” “Hab”

A HTML címke azt mondja, hogy a HTML-dokumentum kezdődik és végződik

HTML / HTML

A szolgáltatási információk elhelyezéséhez vezető címke szükséges, itt a stílusok vannak csatlakoztatva, szkriptek és közzétett meta oldal információ. A weboldal látogatói nem látják a címke tartalmát.

Fej / fej

A testcímke tartalmazza az oldal jelölését, a címke tartalmát a webhely látogatói megtekintése.

Test / test

Elrendezés vagy weboldal létrehozása a HTML-en

A helyszíni elrendezés folyamatában a címkék és attribútumok, amelyek ebben a cikkben lehetetlen. Ezért azt javasoljuk, hogy a HAB honlapján, sőt, azt tanácsolom, hogy figyelmesen tanulmányozzák az egyes tag és a CSS stílus találkozik.

{modul}

Tehát mit fogunk tenni:

Háttér és fő keret

Cserélje ki a HA HA-fájl tartalmát a következőkre:

!DOCTYTYTE HTML nyilvános “- // W3C // DTD XHTML // HU” HAB “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “TITLEM ELSŐ HTML / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest !– Főoldal Block – DIV ID = “BASIC” / DIV / BODY / HTML

És add hozzá az ilyen kódhoz:

/ * Helyszínkeret * / test {Padding: 0px; Margó: 0; Háttér: # 4ce; font-sizepx; Font-Család: Arial, Sans-Serif;} #basic {widthpx; MIN-Heightpx; Margó: 0 Auto; Paddingpx 20px 20px 20px; Háttér: #fff;} img {border: 0;} a {színe: # ff9c00;} a: hover {text-dekoráció: none;}

Frissítse az oldalt a webhelyen a böngészőben (F5), akkor lehetséges lesz:

Helyszíni fejléc

Adja hozzá a DIV-címkét az alapazonosítóval a következő kód:

!– Site Cap – Div ID = “Head-site” egy href = “/” img src = “/ képek / Hab” alt = “Coffee shop” cím = “kávézó” // egy img src = “/ képek / hab” ALT = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div

Mi lenne a következő:

!DOCTYTYTE HTML nyilvános “- // W3C // DTD XHTML // HU” HAB “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “TITLEM ELSŐ HTML / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest !– Főoldal Block – Div ID = “Basic” !– Oldal Cap – div id = “head-SITE” a href = “#” IMG SRC = “/ images / HAB” ALT = “Kávézó” title = “Kávézó” // A IMG SRC = “/ images / HAB” Alt = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div / div / test / html

És adjon hozzá sorokat a CSS fájlhoz:

/ * Site Cap * / Hab-BG {háttér: nincs!Fontos;} .Telefon {float: jobb;}

Top menüpont

Bármi legyen is a HTML webhelyünk megjelenik a navigációs menü, amely az Add to Hab után jelenik meg:

!– Oldal Cap – div id = “head-SITE” a href = “#” IMG SRC = “/ images / HAB” ALT = “Kávézó” title = “Kávézó” // A IMG SRC = “/ images / HAB” ALT = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div

Ez a kód:

!– Top Menü Site – Div ID = “Menu-Top” Div Class = “BG-1” ul lia href = “#” rólunk / a / li lia href = “#” válogatás / a / li lia href = “#” Vélemények / A / Li Lia Href = “#” Book A Table / A / Li Lia href = “#” ügyfeleink / Li Li Class = “Nincs-bg” egy href = “#” Kapcsolatok / A / Li / Ul / div div osztály = “BG-2” / div / div

Mi történt ez így:

!DOCTYTYTE HTML nyilvános “- // W3C // DTD XHTML // HU” HAB “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “TITLEM ELSŐ HTML / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest !– Főoldal Block – Div ID = “Basic” !– Oldal Cap – div id = “head-SITE” a href = “#” IMG SRC = “/ images / HAB” ALT = “Kávézó” title = “Kávézó” // A IMG SRC = “/ images / HAB” ALT = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div !– Top Menu Site – div id = “MENU-TOP” div class = “BG-1” UL LIA HREF = “#” Magunkról / A / Li Lia href = “#” választék / A / Li Lia href = “#” Vélemények / A / Li Lia Href = “#” Book A Table / A / Li Lia href = “#” ügyfeleink / Li Li Class = “Nincs-bg” egy href = “#” Kapcsolatok / A / Li / UL / DIV DIV Class = “BG-2” / DIV / DIV / DIV / Body / HTML

És a HAB fájlban:

/ * Felső menü az oldalon * / # felső menüben {widthpx; Magasságpx; } .BG-1 {widthpx; Magasságpx; Háttér: # 4CE URL (Kép / Hab) repeat-x; Kitöltés: 0 0 10px;} .BG-2 {widthpx; Magasság: 8 képpont; Háttér: # FF9C00; Margó: 0 auto;} .BG-1 UL {margin: 0; Kitöltés: 0; Lista-stílus: Nincs;} .BG-1 ul li {float: left; Háttér: URL (kép / HAB) no-repeat jobbközép; Kitöltés: 0 2px 0 0;} .BG-1 UL Li A {Display: Block; Magasságpx; Paddingpx 27px 0 27px; Szín: # FF9C00; Szöveges dekoráció: Nincs; Szöveges transzformáció: nagybetűs;} .BG-1 ul Li A: Hover {szín: #FFF; Háttér: # FF9C00;}

Most a webhelynek van egy telefon logója és a menü, amikor lebegnek a háttérben:

Bal menü és tartalom

Itt az ideje, hogy a bal menü és a blokk tartalommal történjen. Ehhez másolja a kódot, és gondosan tanulmányozza azt, amit. A blokk után:

!– Top menüpont – DIV ID = “MENU-TOP” / DIV

A következőket adjuk hozzá:

!– Bal menü és tartalom – DIV ID = “Tartalom” !– Tartalom – jobb blokk – DIV Class = “right” H1Kof Americano / H1 Padramism, első közelítésben, kezdődik egy bizonyos szintézisét Arts. Integritás, első pillantásra, kecsesen ábrázolja a “mentális mutáció” fenomeret. Hermeneutika, bármennyire úgy tűnt paradox, a kecsesen folytatjuk egyedfejlődés, ezért a hasonló törvények kontrasztos fejlődés jellemző mindkét folyamat a psziché. / P P szerződés A Theodore Lipps által kifejlesztett “Indokolás” elméletét, a Phlegmatic adja Eidos-t. A művészeti észlelés társadalmi-pszichológiai tényezőt képez, így az Archetype és a mítosz összes felsorolt ​​jelei megerősítik, hogy a mítoszkészítés mechanizmusainak hatása hasonlít a művészi és termelési gondolkodás mechanizmusára. Paródia, a hagyományos ötletek szerint elegánsan szimulálja a romboló elvárási horizontot./ P img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” / PHF tag rituálé, definíció szerint a klaszterelemzési módszert szemlélteti. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P Palanclood gótikus művészi rituálé. A teremtés észlelése, beleértve, egy állandó koleritást használ, így a Hab saját antithézisét megfogalmazza. A fikció a művészet elvét szemlélteti. / P PPGorizont várakozások A tényszerű oedipális komplex komplexum felhalmozódása, ezért a kontrasztos fejlődés hasonló törvényei mindkét folyamatra jellemzőek. Gaming Start, egy vagy más módon épít egy konstruktív etikettet, így a Hab saját antithézisét megfogalmazza./ P Ritual Ritual, definíció szerint illusztrálja a klaszterelemzési módszert. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P / div !

A Hab fájl így fog kinézni:

!DOCTYTYTE HTML nyilvános “- // W3C // DTD XHTML // HU” HAB “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “TITLEM ELSŐ HTML / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest !– Főoldal Block – Div ID = “Basic” !– Oldal Cap – div id = “head-SITE” a href = “#” IMG SRC = “/ images / HAB” ALT = “Kávézó” title = “Kávézó” // A IMG SRC = “/ images / HAB” ALT = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div !– Top Menü Site – Div ID = “Menu-Top” Div Class = “BG-1” ul lia href = “#” rólunk / a / li lia href = “#” válogatás / a / li lia href = “#” Vélemények / A / Li Lia Href = “#” Book A Table / A / Li Lia href = “#” ügyfeleink / Li Li Class = “Nincs-bg” egy href = “#” Kapcsolatok / A / Li / Ul / div div osztály = “BG-2” / div / div !– Bal menü és tartalom – DIV ID = “Tartalom” !– Tartalom – jobb blokk – DIV Class = “right” H1Kof Americano / H1 Padramism, első közelítésben, kezdődik egy bizonyos szintézisét Arts. Integritás, első pillantásra, kecsesen ábrázolja a “mentális mutáció” fenomeret. Hermeneutika, bármennyire úgy tűnt paradox, a kecsesen folytatjuk egyedfejlődés, ezért a hasonló törvények kontrasztos fejlődés jellemző mindkét folyamat a psziché. / P P szerződés A Theodore Lipps által kifejlesztett “Indokolás” elméletét, a Phlegmatic adja Eidos-t. A művészeti észlelés társadalmi-pszichológiai tényezőt képez, így az Archetype és a mítosz összes felsorolt ​​jelei megerősítik, hogy a mítoszkészítés mechanizmusainak hatása hasonlít a művészi és termelési gondolkodás mechanizmusára. Paródia, a hagyományos ötletek szerint elegánsan szimulálja a romboló elvárási horizontot./ P img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” / PHF tag rituálé, definíció szerint a klaszterelemzési módszert szemlélteti. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P Palanclood gótikus művészi rituálé. A teremtés észlelése, beleértve, egy állandó koleritást használ, így a Hab saját antithézisét megfogalmazza. A fikció a művészet elvét szemlélteti. / P PPGorizont várakozások A tényszerű oedipális komplex komplexum felhalmozódása, ezért a kontrasztos fejlődés hasonló törvényei mindkét folyamatra jellemzőek. Gaming Start, egy vagy más módon épít egy konstruktív etikettet, így a Hab saját antithézisét megfogalmazza./ P Ritual Ritual, definíció szerint illusztrálja a klaszterelemzési módszert. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P / div !

És a CSS fájl másolatának végén:

/ * Bal menü és tartalom * / #Conent {widthpx; Paddingpx 0 0 0; } .Jobbra {Float: Jobb; widthpx; Padding: 0 0 0 20px; Text-Align: Indokolás;} .Jobb H1 {Text Transform: Nagybetűs; Szín: # 4ce; betűsúly: normál; Margin-Top: 0;} .maradt {widthpx; Balra lebeg;} .blokk-nad-menü {widthpx; Magasságpx; Háttér: # FF9C00;} .blokk-pod-menü {widthpx; Margó: 0 0 10px; Magasságpx; Háttér: # 4ce;} .Blokk-menü {widthpx; Border balL PX szilárd # FF9C00; Háttér: # 4ce;} .bal ul {margó: 0; Paddingpx 0 0 0; Lista-stílus: Nincs;} .Bal Li {Background: URL (képek / hab) nem ismétlődő alsó balra;} .Balra ul li a {kijelző: blokk; widthpx; Szín: #FFF; Szöveges dekoráció: Nincs; Paddingpx 5px 10px 40px; Háttér: URL (képek / Hab) No-Repeat 10px 8px;} .Bal ul li a: Hover {háttér: # ff9c00 url (képek / hab) nem ismétlődő 10px 8px;} Hab-BG {háttér: nincs!Fontos;}

Ha minden rendben van, az oldal az alábbi képen van:

Sitet webhely

A blokk után:

!– Bal Menü – Bal Blokk blokk – DIV osztály = “bal” / div

Insert:

Div osztály = “myclr” / div !– Basement – DIV ID = “Podval” div osztály = “sárga” / div div osztály = “P1” LLC “kávézó”.Br / g. Moszkva, forradalmi 1a / div osztály = “P3” IMG SRC = “/ képek / Hab” alt = “” cím = “” “” // div osztály = “P2” web stúdió létrehozása weboldalak href = “#” parampampam A / div / div div osztály = “myclr” / div

Most az egész Hab fájl így néz ki:

!DOCTYTYTE HTML nyilvános “- // W3C // DTD XHTML // HU” HAB “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “TITLEM ELSŐ HTML / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest !– Főoldal Block – Div ID = “Basic” !– Oldal Cap – div id = “head-SITE” a href = “#” IMG SRC = “/ images / HAB” ALT = “Kávézó” title = “Kávézó” // A IMG SRC = “/ images / HAB” ALT = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div !– Top Menü Site – Div ID = “Menu-Top” Div Class = “BG-1” ul lia href = “#” rólunk / a / li lia href = “#” válogatás / a / li lia href = “#” Vélemények / A / Li Lia Href = “#” Book A Table / A / Li Lia href = “#” ügyfeleink / Li Li Class = “Nincs-bg” egy href = “#” Kapcsolatok / A / Li / Ul / div div osztály = “BG-2” / div / div !– Bal menü és tartalom – DIV ID = “Tartalom” !– Tartalom – jobb blokk – DIV Class = “right” H1Kof Americano / H1 Padramism, első közelítésben, kezdődik egy bizonyos szintézisét Arts. Integritás, első pillantásra, kecsesen ábrázolja a “mentális mutáció” fenomeret. Hermeneutika, bármennyire úgy tűnt paradox, a kecsesen folytatjuk egyedfejlődés, ezért a hasonló törvények kontrasztos fejlődés jellemző mindkét folyamat a psziché. / P P szerződés A Theodore Lipps által kifejlesztett “Indokolás” elméletét, a Phlegmatic adja Eidos-t. A művészeti észlelés társadalmi-pszichológiai tényezőt képez, így az Archetype és a mítosz összes felsorolt ​​jelei megerősítik, hogy a mítoszkészítés mechanizmusainak hatása hasonlít a művészi és termelési gondolkodás mechanizmusára. Paródia, a hagyományos ötletek szerint elegánsan szimulálja a romboló elvárási horizontot./ P img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” / PHF tag rituálé, definíció szerint a klaszterelemzési módszert szemlélteti. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P Palanclood gótikus művészi rituálé. A teremtés észlelése, beleértve, egy állandó koleritást használ, így a Hab saját antithézisét megfogalmazza. A fikció a művészet elvét szemlélteti. / P PPGorizont várakozások A tényszerű oedipális komplex komplexum felhalmozódása, ezért a kontrasztos fejlődés hasonló törvényei mindkét folyamatra jellemzőek. Gaming Start, egy vagy más módon épít egy konstruktív etikettet, így a Hab saját antithézisét megfogalmazza./ P Ritual Ritual, definíció szerint illusztrálja a klaszterelemzési módszert. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P / div !– Basement – DIV ID = “Podval” div osztály = “sárga” / div div osztály = “P1” LLC “kávézó”.Br / g. Moszkva, forradalmi 1a / div osztály = “P3” IMG SRC = “/ képek / Hab” alt = “” cím = “” “” // div osztály = “P2” web stúdió létrehozása weboldalak href = “#” parampampam “MyClr” / div / div / body / html

Adjon hozzá kódot az alsó CSS ​​fájlhoz:

/*Pince*/ .Myclr {tiszta: mindkettő; Float: Nincs; szélesség%; Magasság: 1px;} #podval {Border-Toppx Solid # 4CE; margin-toppx;} .Sárga {widthpx; Magasság: 5px; Margó: 0 Auto; Háttér: # FF9C00;} .P1 {float: maradt; widthpx; Paddingpx 0 0 0;} .P2 {float: jobb; widthpx; Szöveg-igazítás: jobb; Paddingpx 20px 0 0;} .P3 {float: jobb; widthpx; Paddingpx 0 0 0;}

Most az egész Hab fájl így néz ki:

/ * Helyszínkeret * / test {Padding: 0px; Margó: 0; Háttér: # 4ce; font-sizepx; Font-Család: Arial, Sans-Serif;} #basic {widthpx; MIN-Heightpx; Margó: 0 Auto; Paddingpx 20px 20px 20px; Háttér: #fff;} img {border: 0;} a {színe: # ff9c00;} a: hover {text-dekoráció: none;} / * webhelyről sapka * / # Fej-site {heightpx;} HAB-bg { Háttér: nincs!Fontos;} .Telefon {Float: Jobb;} / * felső menüpont * / # felső menü {widthpx; Magasságpx; } .BG-1 {widthpx; Magasságpx; Háttér: # 4ce URL (képek / hab) ismétlés-x; Padding: 0 0 10px;} .BG-2 {widthpx; Magasság: 8px; Háttér: # FF9C00; Margó: 0 Auto;} .BG-1 ul {margó: 0; Padding: 0; Lista-stílus: nincs;} .Bg-1 ul li {float: maradt; Háttér: URL (képek / hab) nem ismétlődő jobbközpont; Padding: 0 2px 0 0;} .BG-1 UL Li A {Display: Block; Magasságpx; Paddingpx 27px 0 27px; Szín: # FF9C00; Szöveges dekoráció: Nincs; Szöveges transzformáció: nagybetűs;} .BG-1 ul Li A: Hover {szín: #FFF; Háttér: # FF9C00;} / * Bal Menü és tartalom * / #content {widthpx; Paddingpx 0 0 0; } / * Tartalom – jobb blokk * / .Jobbra {Float: Jobb; widthpx; Padding: 0 0 0 20px; Text-Align: Indokolás;} .Jobb H1 {Text Transform: Nagybetűs; Szín: # 4ce; betűsúly: normál; Margin-Top: 0;} / * Bal Menü – Bal Blokk * / .maradt {widthpx; Balra lebeg;} .blokk-nad-menü {widthpx; Magasságpx; Háttér: # FF9C00;} .blokk-pod-menü {widthpx; Margó: 0 0 10px; Magasságpx; Háttér: # 4ce;} .Blokk-menü {widthpx; Border balL PX szilárd # FF9C00; Háttér: # 4ce;} .bal ul {margó: 0; Paddingpx 0 0 0; Lista-stílus: Nincs;} .Bal Li {Background: URL (képek / hab) nem ismétlődő alsó balra;} .Balra ul li a {kijelző: blokk; widthpx; Szín: #FFF; Szöveges dekoráció: Nincs; Paddingpx 5px 10px 40px; Háttér: URL (képek / Hab) No-Repeat 10px 8px;} .Bal ul li a: Hover {háttér: # ff9c00 url (képek / hab) nem ismétlődő 10px 8px;} / * alagsor * / .Myclr {tiszta: mindkettő; Float: Nincs; szélesség%; Magasság: 1px;} #podval {Border-Toppx Solid # 4CE; margin-toppx;} .Sárga {widthpx; Magasság: 5px; Margó: 0 Auto; Háttér: # FF9C00;} .P1 {float: maradt; widthpx; Paddingpx 0 0 0;} .P2 {float: jobb; widthpx; Szöveg-igazítás: jobb; Paddingpx 20px 0 0;} .P3 {float: jobb; widthpx; Paddingpx 0 0 0;}

És az a hely, mint ez:

Más oldaloldalak és menühivatkozások

A webhely kiderült, de amikor rákattintok a menübeli linkekre, semmi sem történik. Ezért fel kell találnunk az oldalak nevét, regisztráljuk őket az URL menüben, és hozzon létre oldalakat ezekkel a nevekkel.

Az oldal címének egyedinek kell lennie, és latin szimbólumból áll. Csak fordítottam le a menüelemek nevét.

• Hab & #; Rólunk
• Hab & #; Hatótávolság
• Hab & #; Vélemény
• Hab & #; Asztalt foglalni
• Hab & #; az ügyfeleink
• Hab & #; Névjegyzék

Ugyanezt kell tenni a bal menüvel.

• Hab & #; Ireish kávé
• Hab & #; Kávé “americano
• Hab & #; Kávéfőző
• Hab & #; Kávé mártás
• Hab & #; Kávé cappuccino
• Hab & #; Kávé Kon Panna
• Hab & #; Kávé coraetto
• Hab & #; Látte
• Hab & #; Kávé lungo

Most nyissa ki a HAB a Notepad ++ hozzá a szükséges hivatkozásokat a megfelelő menü, mi történt, mint ez:

!DOCTYTYTE HTML nyilvános “- // W3C // DTD XHTML // HU” HAB “HTML HEAD META HTTP-EQUIV =” TARTALOM TÍPUS “TARTALOM =” TEXT / HTML; Charset = UTF-8 “TITLEM ELSŐ HTML / Cím link rel = “Stylesheet” href = “/ Hab” típus = “Text / CSS” / / fejtest !– Főoldal Block – Div ID = “Basic” !– Oldal Cap – div id = “head-SITE” a href = “#” IMG SRC = “/ images / HAB” ALT = “Kávézó” title = “Kávézó” // A IMG SRC = “/ images / HAB” ALT = “+ 7 ()” cím = “+ 7 ()” osztály = “telefon” / / div !– Top Menü Site – Div ID = “Menu-Top” Div Class = “BG-1” UL LIA HREF = “/ Hab” Rólunk Rólunk / A / Li Lia href = “/ Hab” választék / a / li lia href = ” / HAB”HAB / a / LI LIA hREF = “/ HAB” Asztalfoglalás / a / li lia href = “/ hab” ügyfeleink / a / li li class = “none-bg” a href = “/ hab” Kapcsolatok / A / Li / Ul / Div DIR osztály = “BG-2” / div / div !– Bal menü és tartalom – DIV ID = “Tartalom” !– Tartalom – jobb blokk – DIV Class = “right” H1Kof Americano / H1 Padramism, első közelítésben, kezdődik egy bizonyos szintézisét Arts. Integritás, első pillantásra, kecsesen ábrázolja a “mentális mutáció” fenomeret. Hermeneutika, bármennyire úgy tűnt paradox, a kecsesen folytatjuk egyedfejlődés, ezért a hasonló törvények kontrasztos fejlődés jellemző mindkét folyamat a psziché. / P P szerződés A Theodore Lipps által kifejlesztett “Indokolás” elméletét, a Phlegmatic adja Eidos-t. A művészeti észlelés társadalmi-pszichológiai tényezőt képez, így az Archetype és a mítosz összes felsorolt ​​jelei megerősítik, hogy a mítoszkészítés mechanizmusainak hatása hasonlít a művészi és termelési gondolkodás mechanizmusára. Paródia, a hagyományos ötletek szerint elegánsan szimulálja a romboló elvárási horizontot./ P img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” style = “margin-rightpx; / img src = “/ képek / Hab” alt = “” cím = “” / PHF tag rituálé, definíció szerint a klaszterelemzési módszert szemlélteti. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P Palanclood gótikus művészi rituálé. A teremtés észlelése, beleértve, egy állandó koleritást használ, így a Hab saját antithézisét megfogalmazza. A fikció a művészet elvét szemlélteti. / P PPGorizont várakozások A tényszerű oedipális komplex komplexum felhalmozódása, ezért a kontrasztos fejlődés hasonló törvényei mindkét folyamatra jellemzőek. Gaming Start, egy vagy más módon épít egy konstruktív etikettet, így a Hab saját antithézisét megfogalmazza./ P Ritual Ritual, definíció szerint illusztrálja a klaszterelemzési módszert. Sanguine, egy vagy más módon változik. Az alábbiak nagyon jelentősek: animus a manyizmus, az volt a ropogó erők komplexuma, akik a szublimáció elméletében írtak./ P / div !– Bal Menü – Bal Blokk Block – DIV osztály = “Bal” Div ID = “Bal menü” DIV osztály = “Block-NAD-menü” / div div osztály = “blokk-menü” ul lia href = “/ Hab kávé / A / Li Lia href = “/ Hab” kávé amerikai / a / li lia href = “/ Hab” kávé glasa / a / li lia href = “/ Hab” kávé dippió / a / li lia href = “/ hab” Kávé cappuccino / A / Li Lia Href = “/ HAB “Kávé Panna / A / Li Lia Href =”/ Hab “Kávé / A / Li Lia Href =”/ Hab” kávé latte / A / Li Li Class = „none -Bg “href =” / Hab “kávé lungo / a / li / ul / div div osztály =” blokk-pod-menü “/ div / div / div / div osztály =” myclr “/ div !– Basement – DIV ID = “Podval” div osztály = “sárga” / div div osztály = “P1” LLC “kávézó”.Br / g. Moszkva, forradalmi 1a / div osztály = “P3” IMG SRC = “/ képek / Hab” alt = “” cím = “” “” // div osztály = “P2” web stúdió létrehozása weboldalak href = “#” parampampam “MyClr” / div / div / body / html

Most kattintson a & #; Mentés & #; Majd & #; mentse az AS & # fájl; és mentse a fájlt minden link a megfelelő nevet a mappa az oldalon fájlokat. Ez történt velem:

Minden webhely készen áll. Csak a tartalom megváltoztatása minden oldalon.

Ez az oldal nem törődik az egyszerűségével, nagyon nagy hátránya van. Mi módosítani kell egy menüpontot vagy tervezési elemet, meg kell tennie az egyes webhelyeken. Amikor a 10-nél több oldalak szörnyű zavartság kezdődnek. Tehát a HTML webhely létrehozása a notepadban azt javasolja, hogy csak nagyon kevés webhelyek vagy egyoldalas leszállási oldal. És a CMS mestereinek teljes területeihez (nem olyan bonyolultak, mint amilyennek látszik).