Lentelės. Lentelių atributai

Pomėgiams » IT patarimai » Temos » HTML pagrindai


Dažnai internetiniuose puslapiuose, naudojamos įvairios lentelės, nes, tai kompaktiškas, malonus akiai ir lengvai suprantamas informacijos pateikimo būdas, leidžiantis išdėstyti tekstus ir iliustracijas eilutėse bei stulpeliuose. Lenteles tikslinga naudoti, kai:

... turi būti pateikiama lentelinė informacija, tai vardų sarašai, numeracija ir t.t.

... norite glaudžiau susieti tekstą ir piešinėlius, ir jums nepakanka <IMG align=left> arba <IMG align=right>

... norite įrėminti tekstą ar iliustraciją.

... norite tekstą išdėstyt stulpeliais.



Lentelė prasideda komanda <TABLE>...</TABLE> Rėmelis gaunamas įterpus BORDER ir nurodžius linijos stori, jei reiksme 0 – lentelė yra be rėmelio, ir realiai pati lentelė nematoma.

Po žymės <TABLE> seka žymė <TR>...</TR>. Ji skirta lentelės eilutėms, kuriose gali būti keletas langelių, skirtu informacijai, aprašymui. Kiekvienam informacijos langeliui sudaryti naudojama žymė <TD>...</TD>. Į langelius galite patalpinti betkurią kitą žymę su atributais (komandomis), tačiau ji galios tik tam pačiam langelyje, ir kitame langelyje reiks nustatymus pakartoti.

PVZ.: Paprasta lentelė su 2x2 langeliais.

<TABLE border="1">

<TR>

<TD>PIRMAS</TD>

<TD>ANTRAS</TD>

</TR>

<TR>

<TD>PIRMAS</TD>

<TD>ANTRAS</TD>

</TR>

</TABLE>

PIRMASANTRAS
TrečiasKetvirtas


Tikslesnių lentelės išmatavimų nustatymui įterpiama į <TABLE> komandas WIDTH ir HEIGHT. O norint nustatyti atskirų langelių dydžius, minėtos komandos į terpiamos Į <TD>. Aukščio ir pločio reikšmės rašomos arba pixeliais arba % nuo bendros lentelės dydžio.

<table BORDER="1" WIDTH="90%" >

<tr>

<td WIDTH="20%">SIAURAS</td>

<td WIDTH="80%">PLATUS</td>

</tr>

</table>

SIAURASPLATUS


Pagal nutylėjimą, visa informacija langeliuose, bus išlygiuota pagal kairįjį kraštą ir centruojama vertikaliai pagal centrą. Jei reikia kitaip, langelių turinį horizontaliai ir vertikaliai žymėse <TD> lygiuojama komandomis ALIGN ir VALIGN. Įterpus į <tr> bus lygiuojama visa lentelės eilutė.

ALIGN - left/right/center.

VALIGN - top/bottom/center/middle/baseline.

<table BORDER COLS=1 WIDTH="90%" >

<tr ALIGN=RIGHT VALIGN=BOTTOM>

<td WIDTH="20%">1</td>

<td WIDTH="80%">2</td>

</tr>

<tr>

<td ALIGN=CENTER VALIGN=BOTTOM>3</td>

<td ALIGN=LEFT VALIGN=TOP>4</td>

</tr>

</table>

12
34


Dar kelios komandos, galinčios pakeisti bendrą lentelės vaizdą.

CELLSPACING="taškai" - Kiekvienas lentelės langelis HTML dokumente gali būti atskirtas nuo kitų langelių... būtent šis atributas ir nustato, kokio pločio bus skiriamoji langelių erdvė.
» S k a i t y t i  t o l i a u
<TABLE border="1" CELLSPACING="5">

<TR>

<TD>PIRMAS</TD>

<TD>ANTRAS</TD>

</TR>

<TR>

<TD>PIRMAS</TD>

<TD>ANTRAS</TD>

</TR>

</TABLE>

PIRMASANTRAS
TrečiasKetvirtas


CELLPADDING="taškai" - Nurodo koks turi būti atstumas tarp informacijos langelio viduje ir langelio bortelio.

<TABLE border="1" CELLPADDING="10">

<TR>

<TD>PIRMAS</TD>

<TD>ANTRAS</TD>

</TR>

<TR>

<TD>PIRMAS</TD>

<TD>ANTRAS</TD>

</TR>

</TABLE>

PIRMASANTRAS
TrečiasKetvirtas


Lentelės komanda <TR> - jos paskirtis - suskirstyti lentelę į eilutes, kiekviena lentelės eilutė HTML dokumente turi prasidėti komanda <TR> ir baigtis jos pabaigos žyme </TR>. Tik tokiu būdu peržiūros programa gali teisingai sudalinti lentelę į langelius. Ši komada taip pat turi savo atributus:

ALIGN="LEFT|CENTER|RIGHT" - Nurodo kokia bus horizontalioji šios eilutės langelių turinio orientacija - link kairiojo/dešinio krašto ar langelio centre.

VALIGN="TOP|MIDDLE|BOTTOM|BASELINE" - Nurodo kokia bus vertikalioji šios eilutės langelių turinio orientacija - informacija bus viršuje, centre, apačioje ar visų eilutės langelių turinys "lygiuos" savo apačia vienu lygiu.

BGCOLOR="spalvos kodas" - Nurodo kokia bus šios eilutės langelių fono spalva.

Lentelės stulpelių pavadinimams yra skirta atskira komanda <TH>...</TH>. Šiaip komandos <TH> ir <TD> yra labai panašios, tiksliau komanda <TH> yra atskiras komandos <TD> atvejis, kai tekstas langelyje yra paryškintas (Bold) ir jos turinys pagal nutylėjimą centruotas tiek horizontaliai, tiek vertikaliai.

<TABLE border="1" WIDTH="90%">

<TR BGCOLOR="#C0C0C0">

<TH> Pirmas stulpelis </TH>

<TH> Antras stulpelis </TH>

</TR>

<TR BGCOLOR="#999999" ALIGN="Center">

<TD> Duomenys </TD>

<TD> Duomenys </TD></TR>

<TR VALIGN="Middle">

<TD> Duomenys <BR> Duomenys2</TD>

<TD> Duomenys </TD>

</TR>

<TR BGCOLOR="#999999" ALIGN="Center">

<TD> Duomenys </TD>

<TD> Duomenys </TD>

</TR>

<TR VALIGN="Middle">

<TD> Duomenys <BR> Duomenys2</TD>

<TD> Duomenys </TD>

</TR>

</TABLE>

Pirmas stulpelis Antras stulpelis
Duomenys Duomenys
Duomenys Duomenys2 Duomenys
Duomenys Duomenys
Duomenys Duomenys2 Duomenys


Paminėsiu dar kelis lentelių atributus:

NOWRAP - Tai reikalavimas neskaidyti teksto ląstelėse į dalis taip, kad lentelė tilptų į peržiūros langą. Analogiškas rezultatui, apskliaudžiant komanda <NOBR>.

COLSPAN="skaičius" - Šis atributas naudojamas nurodyti, kiek stulpelių turi aprėbti konkretus langelis. Paprastai llangelio plotis yra vienas stulpelis, bet kartais reikalinga, kad tas pats langelis būtų kelių stulpelių pločio.

ROWSPAN="skaičius" - Analogiška COLSPAN bet eilučių atžvilgiu: nurodo kiek eilučių aprėbs konkretus langelis.

<TABLE BORDER=1 WIDTH="90%">

<TR BGCOLOR="#C0C0C0">

<TH COLSPAN=2> Pirmas stulpelis </TH>

<TH ROWSPAN=2> Antras stulpelis</TH>

</TR><TR BGCOLOR="#C0C0C0">

<TH BGCOLOR="#808080">Pirma stulpelio dalis </TH>

<TH>Antra stulpelio dalis</TH>

</TR><TR BGCOLOR="#999999" ALIGN="Center">

<TD>Duomenys</TD>

<TD NOWRAP> Duomenys</TD>

<TD VALIGN="Bottom">Kiti duomenys</TD>

</TR><TR VALIGN="Middle">

<TD ALIGN="Right" ROWSPAN=2>Duomenys <BR>Antra eilutė</TD>

<TD ROWSPAN=2> Duomenys</TD>

<TD>Pirma eilutė</TD>

</TR><TR>

<TD ALIGN="Right">Antra eilutė</TD>

</TR>

</TABLE>

Pirmas stulpelis Antras stulpelis
Pirma stulpelio dalis Antra stulpelio dalis
Duomenys Duomenys Kiti duomenys
Duomenys Antra eilutė Duomenys Pirma eilutė
Antra eilutė


PASTABOS:

Jei perskaičius, neaišku, pabandykit realiai ir viskas bus aišku.

Taip pat, vertėtų prisiminti, kad skirtingos naršyklės dažnai "supranta" skirtingai komandas. Visa info pritaikyta Internet Explorer naršyklei.



Patiko [0]  Nepatiko [0]


Jūsų nuomonė padeda mums tobulėti
Įrašoma tik pirmą Jūsų nuomonė.
Jei turite ką plačiau parašyti.. administratoriaus el.paštas llaimaa[et.]gmail.com



Siūlome pasidairyti..

Padėkos žodžiai Mamai

Padėkos žodžiai Mamai... Brangioji saule, kai iš dangaus žiūrėsi į žemę, pačiais šilčiausiais spinduliais glostyk mano mamos galvą, kad ji pajustų, kokia man yra brangi..

Draugams » SVEIKINIMAI

Vaikystės skonis: purus varškės apkepas, kuris visada pavyksta

Vaikystės skonis: purus varškės apkepas, kuris visada pavyksta... Varškės apkepas – tai ne tik gardus, bet ir nostalgiškas patiekalas, kuris daugeliui primena vaikystę. Jis gali būti patiekiamas pusryčiams, desertui ar net vakarienei. Svarbiausia – tinkamai..

Aktualijos » VERTA žinoti

Kaip veikia rekuperatorius?

Kaip veikia rekuperatorius?... Rekuperatorius veikia pagal šilumos mainų principą: jis perduoda šilumą iš išorės į patalpą žiemą ir atvirkščiai – vasarą, palaikant patogią temperatūrą. Šilumos mainų efektyvumas priklauso nuo įr..

Aktualijos » VERTA žinoti

Kaip taupiai naudoti elektrą?

Kaip taupiai naudoti elektrą?... mokslininkai apskaičiavo, kad apšvietimui tenka nuo 15 iki 50 proc. visos suvartojamos elektros..

Įdomybės » AR ŽINAI

Vandens pramogų naujovės: išbandysite ir pamilsite

Vandens pramogų naujovės: išbandysite ir pamilsite.. turbūt niekas nepaneigs, kad geriausias laisvalaikio praleidimo būdas šią vasarą – vandens pramogos. Tačiau pabodus nardyti Lietuvos ežeruose ar šokinėti į vandenį nuo tramplino, vandens pramogų..

Nuotaikai » IDĖJOS laisvalaikiui

Faktai apie kavą

Faktai apie kavą... Ar žinote, kad jeigu kavos išgeriama daug, ją patariama gerti kartu su saldumynais ar kokiais nors kitais riebiais produktais, nes jie sustiprins gerąsias kavos savybes ir silpnins blogąsias...

Įdomybės » FAKTAI


GYVENKIME • sveikaispalvotaipatogiaiskaniaidraugiškaistipriaietiškailinksmaipokštaujantgrybaujantkeliaujant • su meile ir Gyvenimo būdo žurnalu!