Kliknite tukaj, da si ogledate profil, kot ga vidijo drugi

Osnove oblikovanja tabele
Avtor: NikMan | Objavljeno: dne 27. april 2007, 12:04
  Ustvarili bomo tabelo in jo potem korak za korakom obdelovali, kjer boste spoznali vse osnove oblikovanja tabele.
 
 
1
  
 
Ustvarite nov HTML dokument.
 
 
2
  
 
Kliknite na ikono Table (glej sliko).

Lahko kliknete tudi zgoraj na Insert in izberete Table.
 
 
3
  
 
Odpre se okno za oblikovanje tabele.

Rows določite 1 in Columns 2.

To pomeni, da bomo ustvarili ena vrstico in dva stolpca.

Table Width določite 200 pixels in Border thickness 1 pixels.

To pomeni da bo tabela široka 200 in njen rob 1 piko.

Cell padding in Cell spacing nastavite 0 in kliknite na gumb OK.
 
 
4
  
 
Ustvarili ste tabelo z dvema celicama.

Kliknite na rob tabele, da se vam v celoti označi.
 
 
 
 
 
5
  
 
Kliknite na kvadratek Bg color, ki predstavlja določanje ozadja tabele (glej sliko)...
 
 
6
  
 
...in izberite poljubno barvo.

Jaz sem določil oranžno.
 
 
7
  
 
Kliknite na kvadratek Brdr color, ki predstavlja določanje barve obrobe tabele (glej sliko) in določite poljubno barvo.

Jaz sem določil črno.
 
 
8
  
 
Pogled na trenutno stanje.

Kliknite z miško na levo celico v tabeli (glej sliko)...
 
 
9
  
 
... in določite preko kvadratka Background color poljubno barvo.

Jaz sem določil svetlo modro.
 
 
10
  
 
Kliknite na rob tabele, da se vam ponovno v celoti označi.
 
 
11
  
 
Nastavite tabeli Align preko izbirnika na Center in Border na 5.
 
 
12
  
 
Tabela je dobila debelejši rob in je postavljena na sredino.

Kliknite v desno celico (glej sliko).
 
 
13
  
 
Nastavite širino celice v polju W na 70 (glej sliko).

To pomeni, da bomo nastavili širino celice na 70 pik.

Širino lahko nastavljamo tudi v procentih. Vpišite naprimer 30%
 
 
14
  
 
Vpišite v levo celico zmaga in v desno com.

Potem pa kliknite ponovno na rob tabele, da jo boste v celoti označili.
 
 
15
  
 
V polje CellPad vpišite 5.

To pomeni, da smo dolžino med robom in tekstom razširili na 5 pik.
 
 
16
  
 
V polje CellSpace vpišite 2.

To pomeni, da smo dolžino med robom tabele in robom celice razširili za 2 piki.
 
 
17
  
 
Kliknite v levo celico, držite miškin gumb in potegnite na desno stran celice.

S tem ste označili obe celici znotraj tabele.
 
 
18
  
 
Kliknite na ikono Align Center (glej sliko).
 
 
19
  
 
Kliknite na kvadratek Text Color za določanje barve teksta (glej sliko) in izberite poljubno barvo.

Jaz sem določil belo barvo.
 
 
20
  
 
Pogled na končno sliko.
 
 
Komentiraj
  
 
 
 
 
24.2.2010, 0:41
Kako lahko v eno celico napišem več vrstic teksta in da med vrsticami nebi bilo tako velika razdalja. V novo vrstico se pomaknem z tipko enter.
 
 
 
 
3.11.2017, 20:41
Pozdravljeni
Mene zanima pri CS5, ko naredim tabelo z neoznačenimi polji, kako lahko naredim potem recimo pod drugo vrstico črto, ki je edina vidna v celi tabeli. Da malček razložim. Naredim tabelo s 5 kolonami in 10 vrsticami. Za okvir vpišem nič. Zdaj bi pa v tabeli rabil, da je pod drugo vrstico po celi dolžini tabele vidna črta (Border), ostale pa ostanejo v brskalniku nevidne. Kako vnesem to edino obrobo v tabelo?
Hvala lepa za odgovor.
 
 
 
 
5.11.2017, 7:56
Tako stvar boš po moje moral narediti v HTML kodi.

Vsaka vrstica v tabeli je označena z značko <tr>.

Če želiš, da ima ta vrstica spodaj črto, jo spremeni v naslednjo:
<tr style="border-bottom: 1px solid gray">

Poleg tega pa boš moral značko <tabel> spremeniti v:
<table style="border-collapse: collapse;">


Drugi način pa je, da narediš nov class:
.rob_spodaj { border-bottom: 1px solid gray }

Nato pa pri vsakem polju tabele, kjer želiš, da ima spodaj rob, dodaš ta class:
<td class="rob">
 
 
 
 
6.12.2017, 0:26
Hvala za nasvet, na žalost mi ne uspe. V kolikor vstavim ukaz mi zoža tabelo po stolpcih, da je neuporabna. Poleg tega mi povsod kjer so dvopičja ta obarva rdeče, ko gledam v CODE načinu. Bom pa prilepil mojo tabelco, mogoče se da kaj pomagati. Recimo odebeljeno bi rad imel spodnji del vseh treh celic v tabeli v tretji vrstici. Hvala lepa za pomoč in trud.

LP, Marko

 
 
 
 
6.12.2017, 0:34
Da popravim oziroma dopolnim zapis.
Naredim tabelo, vstavim prvi ukaz je ok, ni nobene spremembe. Ko vstavim drugi ukaz da bom moral značke tabele spremeniti, mi tabelo po stolpcih zoža, da je neuporabna. Pri obeh ukazih mi dvopičje izpiše z rdeče obarvanim. o sem kliknil na ukaz Inspect, mi je pa napisal, da manjka Adobe Flesh za Win10. Kar niti ne zastopim kaj naj bi pri tem imel Flesh.
Se pa še učim, jezi me le to, da ravno tistega kar potrebujem največkrat v knjigi o tem programu ne najdem. Mogoče je malček napake, ker iščem v knjigi Dreamweaver MX, uporabljam pa CS5. Zato sprašujem in se zahvaljujem za pomoč.

Lep pozdrav, Marko
 
 
 
 
7.12.2017, 5:48
Prilepi točno HTML kodo, ki jo uporabljaš. Tako bo lažje ugotoviti, kaj je narobe.

Drugače pa predlagam, da si malo prebereš o CSS ter kako se z njim oblikuje.
 
Prijava in registracija
 
 
 
Zmaga.com ponuja brezplačno in razumljivo učenje računalniških programov, vas na enkraten način spozna z različnimi svetovnimi jeziki, s podrobno obrazloženimi recepti prikaže čare kulinarike in vam prežene strahove pred domačimi opravili.
 
 
Poleg tega lahko prebirate poučne članke, ki so namenjene širjenju naše splošne razgledanosti ter preverite svoje znanje z priljubljenim in enostavnim sistemom za preverjanje znanja. Če med vsebinami, ki se dodajajo vsak dan, ne najdete želenega znanja, je za vaša vprašanja na voljo dobro obiskan forum, kjer lahko tudi aktivno sodelujete. V primeru, da bi radi svoje praktično znanje delili z ostalimi, pa to lahko storite preko preprostega vmesnika za dodajanje vsebin. Zmagajte z znanjem z Zmaga.com!
  
Zmaga.com na Facebooku | Pošljite nam e-pošto | Informacije o Zmaga.com