Alkotó - iapkeretben

1. Hozzon létre egy megosztott tömb-konténer

Kijelölt blokkolja a nyitó és záró tag

Ahogy létre az oldalt hoz létre egy közös tároló és identefitsiruem, mint egy „tartály”, a kód lesz:

.







és a fájl style.css stílusossá ezt a tartályt, akkor adja meg a méretet, a szélessége és magassága a tartály, a háttér színe, nos, ez tisztán látható volt konténer keret akkor adjunk járdaszegély

#container margin: 0 auto;
text-align: left;
szélesség: 1037px;
magasság: 700 képpont;
background-color: # F3FAFF;
border: 1px szilárd # 999999;
>

és megnézzük, mi történt azon az oldalon html példa (megnyitás új lapon), és a fájlban style.css bejegyzés nézne

Mint látható, a blokk konténer fordult a forgatáson méretek
szélesség: szélesség = "1037px",
magasság: magasság = „700 képpont”

Általában blokk szélessége méret van beállítva a konkrét számokat, és a magasság, mint a 100% -os biztonságot, és legalább töltse ki az oldal tartalmát, akkor lehet húzni nagy, de jó példa szerepel valódi magasság, ha mi meg height = 100%, akkor látni csak azon az oldalon felső vízszintes sáv, akkor a felső és az alsó határ, beolvadt egy sorban, mert semmi sem kerül a tartályba

2. Hozzon létre egy blokkot a fejléc és a felső menü







Tovább a blokk „konténer” elhelyezni a blokk fejléc az oldalon, és azonosítani, mint a „fejléc”, és egy egységet a felső menüben identefitsiruem, mint „top_menu”

Blokkok „fejléc” és „top_menu” írnak stílusok style.css fájlt

#header background-image: url (images / header.jpg);
szélesség: 1037px;
magasság: 197px;
>

#top_menu background-color: # E1C435;
background-image: url (images / menu.jpg);
szélesség: 1037px;
magasság: 37px;
>

Most a oldal így fog kinézni. rekord a stílus fájl csstakoy

3. létesítése bal, jobb és középső blokkok

Ezután hozzon létre a blokkok balra, jobbra és az oldal közepén és indefetsiruem őket:
id = "left"
id = "right"
id = "tartalom"

A stílus css fájl ezeket a blokkokat felírni stílusok, bal és jobb oszlopban kérni méret szélesség 230px, és az értéke float-pakolás a bal oldalit balra és rendre jobb jobb oldali oszlopban, és a középső oszlop szélességét állítsa nincs szükség, és csak az eltolás a bal oldalon jobb szélén a központi egységhez. Hozzáadás a szélessége a bal és a jobb blokkok 2 pixel a stílusok és felírni behúzás 232px

Most honlapunkon oldal külleme. és a bejegyzést a fájlt style.css lesz ilyen

4. létrehozása alsó blokk egy oldal

Mielőtt a blokk az oldal alján, hozzon létre egy üres blokk, és indefitsiruem, mint egy „tiszta”, ez a mondat, mert felhívja a vonal alatt három blokk - bal, jobb és középső hangsugárzók, valamint hozzon létre egy blokkot, és indefitsiruem, mint egy „footer”

És a fájlt style.css hozzá stílusok ezeket a blokkokat

#footer background-color: # C5AC2E;
background-image: url (images / footer.jpg);
szélesség: 1036px;
magassága: 25 képpont;
padding-top: 0px;
text-align: center;
>

Most a html oldalt az oldal néz ki. és a bejegyzést a fájlt style.css lesz

Továbbra is, hogy létrehozza a felső és bal oldali menük és az oldal keret készen áll, nézni a folytatást, nyomja meg a 4




Kapcsolódó cikkek