În comparație cu lecțiile anterioare, această lecție este o plimbare ușoară în comparație cu o călătorie dificilă prin munți.
Deci schimba logo-ul, deschideți fișierul principal.tpl. Unde sunt modulele pe care le cunoaștem deja din cele anterioare
lecție și unde este logo-ul? uita-te chiar la începutul codului - acesta este tabelul imediat după eticheta corporală, aici este:
În același tabel există și butoane de navigare - le vom șterge, un pic mai târziu vom face meniul nostru de navigare.
Deci, sarcina dvs. - de a vă pregăti logo-ul - design-ul de sus a site-ului.
Ștergeți codul original și introduceți în loc acest lucru:
Apoi, în fișierul css / style.css, introducem următorul cod:
Poziția #masthead: absolută;
top: 0px;
stânga: 2%;
dreapta: 2%;
lățime: 95,6%;
>
#pageNav float: stânga;
lățime: 178px;
padding: 0px;
fundal-culoare: # F5f7f7;
frontieră-dreapta: 1px solid #cccccc;
frontieră de fund: 1px solid #cccccc;
font: mic Verdana, Geneva, Arial, Helvetica,
>
#globalNav poziție: relativă;
lățime: 100%;
min-lățime: 640px;
înălțime: 32px;
culoare: #cccccc;
padding: 0px;
margine: 0px;
fundal-imagine: url ("../ pics / glbnav_background.gif");
background-repeat: repeat-x;
>
#globalNav img margin-bottom: -4px;
>
#gnl position: absolute;
top: 0px;
stânga: 0px;
>
Poziția #gnr: absolută;
top: 0px;
dreapta: 0px;
>
#globalLink position: absolute;
top: 9px;
înălțime: 22px;
min-lățime: 640px;
padding: 0px;
margine: 0px;
stânga: 10px;
z-index: 100;
>
a.glink, a.glink: font-size: 10px;
font-familie: Verdana, Geneva, Arial, Helvetica, sans-serif;
culoare: # 000000;
font-weight: bold;
margine: 0px;
padding: 2px 5px 4px 5px;
frontieră-dreapta: 1px solid # 8FB8BC;
>
a.glink: mutați fundalul-imagine: url ("../ pics / glblnav_selected.gif");
text-decoration: nici unul;
Acest cod este designul întregului top al site-ului, logo-ul, link-urile, locația etc.
Mai departe în fișierul css / style.css găsim
html, înălțimea corpului: 100%;
margine: 0px;
padding: 0px;
fundal: #FFFFFF;
font-size: 11px;
font-familie: tahoma;
>
html, înălțimea corpului: 100%;
margine: 0px;
padding: 0px;
fundal: # 333333;
font-size: 11px;
fundal: #cccccc url ("../ pics / bg_grad.jpg") fix;
font-familie: tahoma;
>
În fișierul principal.tpl găsim linia:
În fișierul style.css, adăugați următoarele rânduri:
tt fundal: transparent;
fundal: #cccccc url ("../ pics / bg_grad.jpg") fix;
>
pagina noastră arată mai bine și mai bine, vom continua să o editați
În fișierul style.css găsim și ștergem următoarele rânduri:
tabelul td padding: 0px;
>
În fișierul principal.tpl găsim linia:
Imaginea de ecran va fi un pic mai departe, atunci când toate părțile necesare ale șablonului sunt luate. toate sunt mici și se potrivesc într-o singură fotografie. 2. Introduceți meniul de navigare - main.tpl nu este un meniu cu o listă de secțiuni, am vorbit despre asta în prima lecție, este vorba de meniul site-ului însuși, Meniu, am adăugat, a se vedea COD 2, prima parte a codului este logo-ul, al doilea - meniul de navigare cu clase CSS am înregistrat deja, clasa GlobalLink, Glink responsabil pentru meniul și locația acestuia relativă la ofrmlenie elemente de pagină +. aici este codul de meniu separat Este destul de simplu, deschideți main.tpl, găsiți linii acolo În loc de acest bloc puteți picta orice doriți, îl puteți șterge, doriți să îl schimbați la masă. luați masa noastră cea mai simplă din info.tpl și editați, eliminând extra și punând titlul și eticheta de ieșire banner, asta sa întâmplat 4. Modificați formularul de căutare În fișierul principal.tpl găsim codul formularului de căutare: Ștergeți și inserați: Formularul de căutare este gata. 5. Modificați drepturile de autor - cele care se află în partea de jos a paginii -main.tpl ATENȚIE! Înlăturați în totalitate drepturile de autor asupra motorului poate numai cel care a cumpărat-o, toate trebuie să utilizeze versiunea gratuită de drepturi de autor. Deschidem main.tpl, în partea de jos găsim codul: Aici este codul blocului în sine, acesta este situat în partea de jos a paginii main.tpl Aici, meniul de navigare este duplicat. Ștergem tot acest cod. căutăm pentru (main.tpl) eticheta, chiar după ce introducem: Ei bine, și în cele din urmă au existat încă două tag-uri în pagina main.tpl pe care nu le-am descris, deși este și într-un manual - afișează informații despre service ale motorului, memento-uri de înregistrare, de exemplu, sau un mesaj care - Rezultatul conținutului de pe site, știri, înregistrarea feedback-ului și alte lucruri, coloana principală Pe asta am totul. Mult noroc! Articole similare |