Modulul CSS necesită să vă gândiți la aspectul site-ului dvs. în ansamblu, apoi să luați piesele și să le puneți împreună. Aflați cum să construiți o schemă simplă în 3 coloane cu CSS.
01 din 09
Desenați aspectul
Puteți să vă desenați aspectul pe hârtie sau într-un program grafic . Dacă aveți deja un cadru de sârmă sau un design mai extins în minte, simplificați-l la casetele de bază care alcătuiesc site-ul. Acest design care însoțește acest articol are trei coloane în zona de conținut principal, precum și un antet și subsol. Dacă te uiți atent, poți vedea că cele trei coloane nu sunt egale în lățime.
După ce ați desenat planul, puteți începe să vă gândiți la dimensiuni. Acest exemplu de design va avea următoarele dimensiuni de bază:
- Nu mai mult de 900 de pixeli lățime
- 20 px jgheab în stânga
- 10 px între coloane și rânduri
- Coloane care sunt de 250px, 300px și 300px lățime
- Rândul superior este de 150 de pixeli înălțime
- Rândul inferior este de 100 de pixeli înălțime
02 din 09
Scrieți cod HTML / CSS de bază și creați un element container
Deoarece această pagină va fi un document HTML valid, începeți cu un container HTML gol
Adăugați în stilurile CSS de bază pentru a zero marginile paginii, marginile și paddings . În timp ce există alte stiluri CSS standard pentru documente noi, aceste stiluri reprezintă minimul necesar pentru a obține un aspect curat. Adăugați-le în capul documentului: