RedzKing
Bine Ati Venit Pe RedzKing Forum !!!
Pentru a avea acces la mai multe functii Logati-va sau Creati un cont nou !!!

Va Multumim !!!
Ne Puteti gasi pe http://redzking.com !!!
Blogul Nostrtu http://blog.redzking.com !!!
RedzKing

Acest Forum Va Ofera Diverse Tutoriale Si Mai Multe Metode De A Face bani Online !!!
 
AcasaFAQCautareMembriGrupuriInregistrareConectare
Ajuta !!!
Cautare
 
 

Rezultate pe:
 
Rechercher Cautare avansata
Banner/Exchange/Platit
Un Mic Blog !!!Image and video hosting by TinyPicCarte de bucate on-line. Bucatarie traditionala romaneasca si slovaca.Banner Exchange sau PLATEIT 25Ron/LunaBanner Exchange sau PLATEIT 25Ron/LunaBanner Exchange sau PLATEIT 25Ron/Luna
Sondaj
Dai Click Pe Reclame Pt A Ajuta Forumu ?
 Da
 Nu
 Care
 Reclamele De Pe Index (SUS)?
Vezi rezultatele
Cele Mai Bune Produse

Distribuiţi | 
 

 Realizarea unui Site

In jos 
AutorMesaj
Admin
Admin
Admin
avatar

Numarul mesajelor : 154
Puncte : 161135
Reputatie : 0
Data de inscriere : 20/02/2009
Varsta : 26

MesajSubiect: Realizarea unui Site   Mar Mar 10, 2009 11:07 pm

Dupa ce am parcurs lectiile de HTML si CSS vom realiza impreuna un mic site, iar ca editor al codului sursa folosim Notepad.
Pentru pozitionarea elementelor distinctive ale paginii pot fi folosite tabele sau CSS. In exemplul nostru vom folosi tabelele.
Layout-ul paginii va fi:
- latime totala 750 px
- sus vom avea un header
- meniul in stanga, latime 150 px
- continutul paginii in drepta
- jos vom avea un footer

Vom crea un tabel cu latime 750 px, avand 3 randuri, iar pe fiecare rand cate 2 celule. Pe randul 1 si 3 unim cele 2 celule.


<table width="750" border="0" cellspacing="0" cellpadding="0">
<tr><td colspan="2">Header</td></tr>
<tr><td width="150">Meniu</td><td width="600">Continut</td></tr>
<tr><td colspan="2">Footer</td></tr>
</table>


Inaltimea fiecarui rand va fi stabilita de elementul cel mai inalt
(imagine sau text), sau prin introducerea atributului height in fiecare
element td. Stabilim pentru randul 1 si 3 inaltime 50 px, iar pentru
randul 2 inaltime 200 px.
Folosind CSS vom formata cele 4 celule in mod independent inserand in fiecare element td atributul class cu valoarea header, meniu, continut si footer.
Utilizarea CSS-ului extern o vom face inserand urmatoarea linie in zona head a paginii.


<link rel="stylesheet" type="text/css" href="site.css">


In fisierul CSS extern stabilim pentru fiecare celula in parte
culoarea si marimea fontului, culoarea fundalului, pozitionarea pe
verticala sau orizontala a continutului, etc.
Puteti vedea fisierele finale html si css pentru pagina creata.
Voua va revine ultima etapa, adaugarea informatiei in fiecare
celula. Pentru dezvoltarea in continuare a paginii puteti introduce in
fiecare celula (in locul textului corespunzator: Header, Meniu,
Continut, Footer) alte etichete html (liste, tabele, formulare) care
pozitioneze informatia dorita.
Header-ul poate contine informatii despre tema site-ului sub forma text
sau imagine (logo sau banner). In meniu introduceti o lista de link-uri
catre celelalte pagini ale site-ului. Footer-ul poate contine link-uri
catre: pagina de contact sau pagini externe.
Pentru a pastra layout-ul prezentat, celelalte pagini ale
site-ului le obtineti copiind fisierul site.html si apoi le redenumiti,
urmand sa modificati continutul functie de tema noii pagini.
Acest mod de obtinere a noilor pagini este cel mai simplu, dar nu cel mai eficient, fiind recomandat incepatorilor.
Metoda 1: utilizarea cadrelor, prin care fiecare zona o transformati in
cadru, in acest fel de la o pagina la alta doar cadrul continut se
schimba. Metoda 2: transformarea fisierelor html in php. Astfel zonele
care se repeta vor fi transformate in fisiere php externe, ele find
adaugate in pagina principala prin include.
Sper ca prin acest exemplu practic, realizarea unui site sa nu mai para ceva asa de complicat.
Sus In jos
Vezi profilul utilizatorului http://redzking.forumz.ro
 
Realizarea unui Site
Sus 
Pagina 1 din 1

Permisiunile acestui forum:Nu puteti raspunde la subiectele acestui forum
RedzKing :: Tutoriale :: Tutoriale HTML-
Mergi direct la: