Kako napraviti tablicu u HTML-u: detaljan opis

Tablica - jedan od najvažnijih, ali istodobno i složenih elemenata koji moraju biti prisutni na web stranicama. Uz njihovu pomoć je praktično primijeniti važne i korisne informacije u prilično sažetom obliku. Naravno, većina urednika u predložaka, radi na različitim motorima, automatski umetnuti tablicu u vaše web stranice ili separat, ali što ako je web dizajn resursa, njene stranice su stvorene od nule? Tada je novak majstor može dobiti problem: kako napraviti tablicu u HTML-u. Da vidimo kako brzo i točno stvoriti stavku.

izabrati editor

Prije svega, počevši stvoriti tablicu, trebali definirati editor u kojem ćete raditi. Naravno, najlakši način da odaberete program u kojem možete stvoriti osnovni kôd stranice. Ali, to je najbolje koristiti za tu svrhu dobra stara notepad.

Vi svibanj pitati, zašto komplicirati svoj život, jer ako to ne učinite sve što je pravo u editor, onda rezultat može vidjeti odmah, previše, pa čak i potiče program za korištenje.

Da, to je istina, ali stvoriti tablicu od nule, ne samo da ćete biti u mogućnosti da temeljito ispitati princip njegovog stvaranja, ali i kako bi se spriječilo neugodno pri upisu i pogreške u temeljnom kodu. Ponekad se dogodi slučajno da se kursor pomakne prema dolje, a proces pisanja koda pogreškom jeza u, što je ponekad teško pronaći. Stvaranje tablice u bilježnicu, možete kopirati kod i zalijepite ga na pravo mjesto za vas.

Algoritam za stvaranje tablice

Za početak, napraviti kratki algoritam, kako napraviti tablicu u HTML-u. Ovo je kako bi se osiguralo da ste razumjeli redoslijed svakog koraka. Zatim analizirati točno kako to obaviti svaku od stavki.

Počnimo s pripremnim radnjama.

1. Nacrtajte shemu na stol papir slici.

2. Točka broj redaka i stanica. Ako je broj različitih prošlosti - mislim svakog ryadochka odvojeno.

3. Odredite broj u retku-zaglavlja stanice (na primjer, «№» ćeliju, „Name” i t. D.).

4. Zapišite osnovne parametre za stolom - boje, visine i širine, poravnanje teksta - ukratko, sve što čini u formi.

Zatim idite izravno na stvaranje tablice:

1. Umetnite tablicu oznake.

2. Umetnite oznake linija temelji se na iznos koji vam je potrebno.

3. Redovi umetnuti oznake stanica (normalnim i velikih), i na temelju iznosa koji su zabilježene na papiru.

4. Postavite parametre za cijelu tablicu.

5. Ako je potrebno podesiti parametre za pojedine stanice.

6. Ispunite našu stanica teksta.

stvoriti tablicu

Dakle, odlučite urednik, sada pogledajmo kako stvoriti tablicu u HTML-u. Oznaka koja omogućuje stol (.

Umetanje tablici oznake, prijeđite na stvaranje reda i stanica.

Sada smo na umu da su ti elementi su također u paru. Oznaka definira niz i - stanice.

Za gornje stanice treba koristiti uparenih elemenata .

Kao što je već spomenuto, prvi korak je povući crtu, onda oni moraju registrirati stanicu. Kako bi se izbjegla zabuna, to je poželjno učiniti bilo padding između svakog bloka u retku ili dva, inače propisati novi blok elemenata pomoću tipke „Tab”.

Kako to može izgledati? Nešto ovako:

• ;
• 'Tr>;
• 'Th> № p / p ;
• 'Th> Naziv ;
• ;
• 'Tr>;
• 'Td> 1 ;
• Ivanov ;
• ;
• .

Kao što možete vidjeti, ništa komplicirano o tome. Glavna stvar - ne bi izgubili u broju redaka i ćelija. Inače, tablica se naginje.

Mi smo rastavljeni stvoriti tablicu u HTML-u, sada možemo prijeći na parametrima oba Matrixa i njegove redove i stanica.

stol Mogućnosti

Kada kod je napisan, potrebno je obratiti pažnju na sljedeće točke: poravnanje u tablici HTML, boju granica, pozadine, teksta, i tako dalje.

Parametri su navedeni u tablici tag . Oni uključuju:

1. Granica - širina granica. Definirano cijeli broj. Po defaultu, svaki stol granice nestaju.

2. Bordercolor - boja granice. To se može dati kao boja heksadecimalnom (# 00008B), a njegovo ime na angliykom (DarkBlue). Prema zadanim postavkama, uvijek je sivo.

3. bgcolor - boja pozadine. Kao što je navedeno po šifri ili nazivu.

4. Poravnajte - uskladiti tekst za stolom. Zadana - na lijevoj strani. Postoje sljedeće mogućnosti za ovaj parametar:

• lijevo - desno folijom;
• -obtekanie pravo na lijevo;
• centar - izlaz stol u sredini bez protoka.

5. širina i visina - širina i visina stola. To može biti ili u pikselima ili u postocima (u odnosu na veličinu prozora preglednika).

Propisivanje određeni pokazatelj, trebali obratiti posebnu pozornost na dizajn. Nakon određivanja parametra da ide znak „jednak”, nakon što je u navodnicima označava unaprijed određenu vrijednost.

Što se tiče boje teksta, onda bi se to na isti način kao običan tekst u HTML formatu.

Primjer tablice:

• ;
• 'Tr>;
• 'Th> № p / p ;
• 'Th> Naziv ;
• ;
• 'Tr>;
• 'Td> 1 ;
• Ivanov ;
• ;
• .

parametri reda

Tako smo već shvatili kako napraviti tablicu u HTML i propisuju njegove glavne parametre. No, što ako nam je potrebno izdvojiti niz? Provjeriti joj ne kao glavno tijelo za stolom?

Parametri linija zapisano u oznaci na isti način kao i tablice podataka. Na liniji sljedeće varijable mogu se definirati:

1. Već je poznato da vas granice, bordercolor i bgcolor.

2. Poravnajte - poravnanje teksta u retku. Može se postaviti na lijevo, centar i desni.

3. Valign - oznaka poravnava tekst okomito. Potrebno je sljedeće vrijednosti:

• top - tekst je poravnat s gornje granice;
• srednji - u sredini;
• donji - donji rub.

klirens linija Primjer:

• ;
• 'Th> № p / p ;
• 'Th> Naziv ;
• .

parametri stanice

I posljednja stvar koju treba obratiti pozornost na one koji žele znati kako to napraviti tablicu u HTML - parametre pojedinih stanica, kako normalno i kapitala. U stvari, sve što je učinio na isti način kao i za stol ili za redom. Jedini je dodao dva važna elementa:

1. Colspan - Ovaj parametar navodi broj stupaca za koje stanica može produljiti.

2. Rowspan - već pokazuje broj redaka okupirana ovim stanicama.

Budući da je dizajn se ne razlikuje od recepata liniji, to neće dovesti u primjeru koda.

nalazi

Napravite tablicu nije tako teško kao što se može činiti na prvi pogled. Glavna stvar prilikom pisanja svoje koda - upornost i pažnju.

Što se tiče kako umetnuti tablicu u HTML-u, onda je kod broj je dovoljno kopirati i zalijepiti ga u mjesto svoje stranice, u kojima je, prema Vašem mišljenju, trebao biti postavljen.

Nemojte se bojati eksperimentirati, i uskoro su savršeno savladali tehniku stvaranja tablice. Sretno!