Dalmapedia:Tečaj (Tablice)

Izvor: Dalmatinski internetski libar
Prijeđi na navigaciju Prijeđi na pretraživanje
Dobrodošli na Dalmatinski internetski libar! Samo registrirani članovi mogu uređivati ovu internetsku enciklopediju Dalmacije, nakon što ih potvrde administratori. Za registraciju klikni ovde!.
Dalmapedia-tecaj.png
Ovaj je članak dio dalmapediina
Uvodnog tečaja
Tečaj

Naslovna stranica
Uređivanje članaka
Oblikovanje članaka
Dalmapoveznice
Slike
Tablice
Stranice za razgovor
Ne zaboravite
Prijavljivanje
Imenski prostori
Zaključak

Vidi

Posebno:Traži

Tablice na wikipediji možete napraviti na dva načina:

  1. koristeći posebne Wiki-šifre (preporučeni način, wiki markup je jako jednostavan)
  2. koristeći standardne HTML elemente: <table>, <tr>, <td> ili <th>...

Do tablice u 4 koraka

  1. Tablica počinje lijevom vitičastom zagradom i okomitom crtom "{|"
  2. Svako polje u tablici počinje okomitom crtom: "|"
  3. Redovi tablice odvajaju se okomitom crtom i crticom "|-"
  4. Tablica završava suprotnom kombinacijom od početne: "|}"

Koraci 2 i 3 se ponavljaju koliko puta je potrebno.

Dodatni elementi

Iako se osnovna tablica može dobiti u 4 koraka, obično se u tablicu dodaju još neki elementi za prikazivanje i oblikovanje.

  • Oblikovanje (kôd za formatiranje) čitave tablice navodi se u istom redu bez razdvajanja; na isti način, kod znaka za novi red oblikuje se samo taj red.
  • Za naslov iznad tablice dodaje se odmah na početku red s okomitom crtom i znakom plus: "|+"
  • Istaknuta polja (zaglavlja i sl.) započinju uskličnikom: "!"
  • Ovisno o preglednosti, polja se mogu pisati na dva načina:
    • ako se svako polje tablice piše na početku novog reda, tj. jedno polje=jedan red, u tom se slučaju samo na početku reda piše jedna okomita crta: "|" (preporučeni način);
    • ako se sva polja pišu u jednom redu (zbog preglednosti kod uređivanja, kad su odgovarajuća polja iz dva reda jedno ispod drugog), onda se međusobno odvajaju dvjema okomitim crtama: "||". Kod istaknutih polja umjesto okomite crte udvaja se uskličnik "!!".
  • Oblikovanje polja se stavlja ispred polja na koje se odnosi i odvaja se od polja samo jednom okomitom crtom

Ovo je primjer usporedbe osnovne i proširene tablice, koja se može dobiti navedenim kodom:

Osnovna Proširena
polje A polje B polje C
polje 1 polje 2 polje 3
Naslov tablice
polje A polje B polje C
polje 1 polje 2 polje 3
{| (oblikovanje)                                - početak tablice, sa ili bez oblikovanja
|+ Naslov tablice                               - naslov tablice
|- (oblikovanje)                                - novi red, može imati oblikovanje
| polje A                                       - pisanje polja u novom redu
| (oblikovanje) | polje B                       - oblikovanje polja B
| polje C                                       -
|-                                              - novi red, može imati oblikovanje
| polje 1 ||(oblikovanje) | polje 2 || polje 3  - pisanje polja u jednom redu, s formatiranjem polja 2
|}                                              - kraj tablice

U donjim primjerima detaljnije je obrađeno oblikovanje tablica.

Primjeri

Standardna tablica s okvirom i istaknutim retkom

Preporučuje se koristiti ovakvu tablicu, jer je grafički najbolje prilagođena izgledu Wikipedije. Upišite class="wikitable", a svako polje istaknutog retka započnite s "!" umjesto "|".

Istaknuti redak se koristi ako sadrži objašnjenja stupaca.

{| class="wikitable"
! Prvi red, prvi stupac
! Prvi red, drugi stupac
! Prvi red, treći stupac
|- 
| Drugi red, prvi stupac
| Drugi red, drugi stupac
| Drugi red, treći stupac
|- 
| Treći red, prvi stupac
| Treći red, drugi stupac
| Treći red, treći stupac
|}

Rezultat:

Prvi red, prvi stupac Prvi red, drugi stupac Prvi red, treći stupac
Drugi red, prvi stupac Drugi red, drugi stupac Drugi red, treći stupac
Treći red, prvi stupac Treći red, drugi stupac Treći red, treći stupac

Obična tablica s okvirom

Ovakva je tablica dosta neusklađena s izgledom Wikipedije, ovdje je samo kao primjer.

{|border='1'
| Prvi red, prvi stupac
| Prvi red, drugi stupac
| Prvi red, treći stupac
|- 
| Drugi red, prvi stupac
| Drugi red, drugi stupac
| Drugi red, treći stupac
|}

Rezultat:

Prvi red, prvi stupac Prvi red, drugi stupac Prvi red, treći stupac
Drugi red, prvi stupac Drugi red, drugi stupac Drugi red, treći stupac

Obična tablica bez okvira

Ne želite okvir oko polja i tablice? Uklonite border='1'

{|
| Prvi red, prvi stupac
| Prvi red, drugi stupac
| Prvi red, treći stupac
|- 
| Drugi red, prvi stupac
| Drugi red, drugi stupac
| Drugi red, treći stupac
|}

Rezultat:

Prvi red, prvi stupac Prvi red, drugi stupac Prvi red, treći stupac
Drugi red, prvi stupac Drugi red, drugi stupac Drugi red, treći stupac

Prozirna tablica

Često želite tablicu koja nema nikakve rubove, ali je problem u tom što "obična tablica bez okvira" ima bijelu pozadinu. Na ovaj način možete kreirati tablicu s prozirnom pozadinom:

{| style="background:none;"
| Prvi red, prvi stupac
| Prvi red, drugi stupac
| Prvi red, treći stupac
|- 
| Drugi red, prvi stupac
| Drugi red, drugi stupac
| Drugi red, treći stupac
|}

Rezultat:

Prvi red, prvi stupac Prvi red, drugi stupac Prvi red, treći stupac
Drugi red, prvi stupac Drugi red, drugi stupac Drugi red, treći stupac

Tablica s pozadinom druge boje

Želite da tablica ima sivu pozadinu i plava slova? Napišite style="background:silver; color:blue" odmah iza "{|" (tamo gdje je pisalo "border='1'").

{|style="background:silver; color:blue"
| Prvi red, prvi stupac
| Prvi red, drugi stupac
| Prvi red, treći stupac
|- 
| Drugi red, prvi stupac
| Drugi red, drugi stupac
| Drugi red, treći stupac
|}

Rezultat:

Prvi red, prvi stupac Prvi red, drugi stupac Prvi red, treći stupac
Drugi red, prvi stupac Drugi red, drugi stupac Drugi red, treći stupac

Za one koji vole neobične tablice

Polje 1 1x1 Polje 2 1x1 Polje 3 1x1 Polje 4 1x1
Polje 1 1x1 Polje 2 2x1 Polje 4 1x2
Polje 1 1x1 Polje 2 1x1 Polje 3 1x1

Slijedi kôd koji je proizveo gornju tablicu:

{| class="wikitable"
| Polje 1   1x1
| Polje 2   1x1
| Polje 3   1x1
| Polje 4   1x1
|- 
| Polje 1   1x1
| colspan="2" | Polje 2   2x1
| rowspan="2" | Polje 4   1x2
|- 
| Polje 1   1x1
| Polje 2   1x1
| Polje 3   1x1
|} 

Sortirajuće tablice

Pogledajte odgovarajuće izabrane savjete:

Ako ni ovo nije dovoljno

...da vaša tablica bude savršena, pogledajte i Table

Za centriranje stupaca, dodajte u zaglavlje tablice class="c1" za centriranje prvoga stupca, class="c1 c3" za centriranje prvog i trećega stupca tablice.

Napomena

Dalmapedia je enciklopedija, ne pretjerujte s tablicama!

dalje >>>