» Lentelės. Lentelių atributai

 TOP meniu » Pradžia » Pomėgiams » IT patarimai » Temos » Konsultuoja IT specialistas Mantas!

• 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.

• 2021 Rugpjūčio 2 d. Pirmadienis.

• Baltojo Metalinio Jaučio metai (iki 2022-01-30).

• Pasveikink varduvininkus: Alfa, Alfas, Alfonsa, Alfonsas, Euzebijus, Guoda, Gustava, Gustavas, Gustė, Gustina, Gustys, Steponas, Tautvaišas, Tautvaišė, Tautvaldas, Tautvilas, Valdė,

• Šios dienos istorijos faktai

• Šiandien pasiklausome: Lapalux - Without You (TWOS Remix)

Marvelės kaskados..... Akmeninės tilto kaskados esančios po istoriniu Kauno keliu (dabar Julijanavos g.) 2012 metais rudenį buvo pritaikytos lankymui. Šiuo metu yra įrengta suoliukai, betoniniai laiptai nuo kalno link ...

Faktai apie šachmatus..... žaidimas vyksta specialioje 8 x 8 langelių dydžio lentoje, kurioje varžovai kovoja dvejomis skirtingų spalvų kariaunomis (juodaisiais ir baltaisiais). Žaidimo tikslas – paskelbti priešininko karal...

Faktai apie varnas..... Varna, skaitoma viena iš protingiausių paukščių - dalis šių paukščių negalėdami perskelti riešuto, jį numeta ant kelio, kad pervažiavusi mašina jį sutraiškytų ir po to viduje esančią valgomą dalį ...

Siūlome paskaityti

 DĖMESIO! Jei radote netikslumų, klaidų, ar žinote tai ko mes nežinome ir norėtute pasidalinti mintimis - brūkštelkit mums :))

Velykų simboliai..... Šv. Velykų simboliai visiems labai gerai žinomi: Velykų kiškutis, Velykų margučiai... Bet iš kur jie atkeliavo iki mūsų dienų, ko gero, ne visi galėtų atsakyti
Atvirukai sekretorėms..... turi draugę dirbančią sekretore? nustebink ir pralinksmink draugę, gražiu e-atviruku sekretorės dienos proga :)
Keistos figūros, dailininkų klaidos..... įdomių bei linksmų paveiksliukų rinkinukas tema - Keistos figūros, dailininkų klaidos - kaip ir nelabai mįslės, bet kažkaip nusprendėme prie jų visai tinka :)