A css-stílusokat külön fájlban lefordítjuk

A CSS stílusok regisztrálása a webhely minden oldalára nagyon kellemetlen, időigényes, és az oldal lassabban nyílik meg. Vegyük fontolóra, hogyan továbbítsuk a CSS stílusokat egy külön fájlba, amely meghatározza a webhely összes oldalának megjelenését. Például, vegye be a CSS-stílusban megtervezett webhely kódját. Azonnal jelöljön ki minden előírt stílust.

/ # Stílusok írása a vízszintes menühöz # /

# tabs10 magasság: 10px;
szélesség: 600px;
>
# tabs10 ul <
margin: 0;
párnázottság: 0px 0px 0px;
lista-stílus: nincs;
>
# tabs10 li <
kijelző: inline;
margin: 0;
párnázottság: 0;

> # tabs10 a <
úszó: balra;
háttér: url ("tableft10.gif") no-repeat left top;
margin: 0;
párnázottság: 0 0 0 4px;
text-decoration: none;
>

# tabs10 a span <
úszó: balra;
kijelző: blokk;
háttér: url ("tabright10.gif") nem-ismétlés jobb felső;
párnázottság: 1px 7px 1px 1px;
szín: #FFF;
> / * A Backslash Hack kommentálta az IE5-Mac szabályát \ * /

# tabs10 a span / * End IE5-Mac hack * /

# tabs9 a: hover span <
szín: #FFF;
>

# tabs10 a: lebegés <
háttér pozíció: 0% -42px;
>

# tabs10 a: hover span <
háttérkép: 100% -42px;
>

# tabs10 # current a <
háttér pozíció: 0% -42px;
>

# tabs10 # current a span <
háttérkép: 100% -42px;
>

/ # Itt a bal és jobb oldali oszlopok stílusai # /

#navlist <
szín: fehér;
háttér: # 17a;
border-bottom: 0.2em szilárd # 17a;
határ-jobb: 0.2em szilárd # 17a;
párnázottság: 0 1px;
margin-left: 0;
szélesség: 12em;
font: normal 10px Verdana, sans-serif;
>

#navlist li <
lista-stílus: nincs;
margin: 0;
betűméret: 1em;
>

#navlist a <
kijelző: blokk;
text-decoration: none;
margin-bottom: 0.5em;
margin-top: 0.5em;
szín: fehér;
háttér: # 39c;
határszélesség: 1px;
határtalan: szilárd;
határszínű: # 5bd # 035 # 068 # 6cf;
border-left: 1em szilárd # fc0;
párnázás: 0.25em 0.5em 0.4em 0.75em;
>

#navlist a <
szélesség: 99%; / * csak az Internet Explorer * /
>

#navlist a <
hang-család: ""> "";
hang-család: öröklés;
szélesség: 9.6em; / * A Tantek-hack csak akkor használható, ha az Internet Explorer 6 szabványnak megfelelő * /
>

#navcontainer> #navlist a <
szélesség: auto; / * csak akkor szükséges, ha a fenti hackeket használja az Internet Explorer * /
>

#navlist a: lebeg, #navlist a # aktuális: lebeg <
háttér: # 28b;
border-color: # 069 # 6cf # 5bd # fc0;
párna: 0.4em 0.35em 0.25em 0.9em;
>

#navlist a: aktív, #navlist a # aktuális: aktív <
háttér: # 17a;
fehér szín: # 069 # 6cf # 5bd fehér;
párna: 0.4em 0.35em 0.25em 0.9em;
> ->

/ # Regisztráljuk a számozatlan listát és lezárjuk a listában szereplő összes linket a konténerben a vízszintes menü # /

/ # Írjon be egy számozatlan listát a bal oldali menühöz # /

Osszuk az oldalt öt blokkra a PHP használatával

Ezt a kódot négy részre szüntettük meg: a sapkát, a bal oldali menüt, a szöveg helyét és a jobb oldali menüt. A nagyobb tisztaság érdekében kiemelném ezeket a területeket a kódon. Bár nem sozdovat teljes webhely a CSS-stílusok és vegye és intézkedik csak a jobb oldali oszlopban a CSS és a sapka, a bal oldali menüben, és maga az oldal a szöveg, akkor ne érintse meg, és hagyja azt, hogy. Tehát látja a különbséget

/ # Írjon be egy számozatlan listát a jobb menühöz # /

Most kivágtuk az egész válogatást, ahol minden stílusunk van. Nyissa meg és illessze be a számítógépbe a másolatot (kivágás) és mentse a fájlt a név alatt: "style.css" Természetesen a fájl ugyanabba a mappába kerül, ahol a weboldalunk található.

Ezután a webhely tetején, ahelyett, hogy kiírná. amely hivatkozik arra a fájlra, ahol minden stílus megtalálható, és amelyet "style.css" -ként mentett el. A webhelyen ez a bejegyzés be van jelölve és be van jelölve.

Még egyszer, vegye figyelembe, hogy a "

Néhány, stílus -
ez bonyolult módon
beszélni egy egyszerű,
mások számára - egyszerűen
beszélni a nehéz.
"Inpropart"