2015.05.27. 15:21, Enma22
Itt igazából adottak a kódok, lehet CSS-be is beletenni, vagy csak abba a modulba, ahol éppen használni kívánod, és akkor minden egyes táblázatnak új kódot tudsz megadni.
Ha modulon belül szerkeszted, akkor a Forráskódot használhatod hozzá, nem kell külön kódnézetre váltani ezért, így azonnal látod az eredményt.
Ha készítesz egy táblázatot a szerkesztőben, és forráskódra váltasz, akkor ezt láthatod:
Ez a táblázat:
Ez pedig a kódja:
<table border="1" cellpadding="1" cellspacing="1" style="width: 400px;">
<tbody>
<tr>
<td>
egyes</td>
<td>
kettes</td>
</tr>
</tbody>
</table>
A table maga a táblázat, a többi szöveg mellette a keretet, a cellatérközt, és igazítást, valamint a méretét adja meg.
A tbody maga a törzs, a tr a sor, a td pedig az oszlop. Egy tr-en belül több td is megadható, és ahány tr van, annyi sor lesz majd.
Valamint ahány td van egy tr alatt, annyi oszlop alakul belőle, lásd a fenti példát.
Remélem azért érthető a dolog.
Általában a td-n alakítunk, vagyis adunk neki egy class kódot.
Vagyis beírjuk a kódunkkat így:
(egyszerűbb ha a táblázatkészítővel alkotunk egyet)
<table border="1" cellpadding="1" cellspacing="1" style="width: 400px;">
<tbody>
<tr>
<td>
szöveg</td>
</tr>
<tr>
<td>
szöveg</td>
</tr>
<tr>
<td>
szöveg</td>
</tr>
</tbody>
</table>
Ebben még nincs szöveg, de még átalakítás előtt nyugodtan lehet felvinni szöveget, képet a táblázatba.
Aztán szépen kigondoljuk, hogy mi legyen a neve az osztálynak, amit adunk neki.
Nálam proba most, hiszen lényegtelen igazából.
Tehát ilyen sorok lesznek:
<td class="proba">
És ide jön a szöveg</td>
Aztán a szokásos módon megalkotjuk a class kódját.
.proba {
}
Töltetnek amit akarsz, betűstílus, betűméret, háttér kép vagy szín, keret, lekerekítés, stb.
Pl:
.proba {
font-family: Tahoma;
font-size: 12pt;
color: #ededed;
border: 1px solid #000000;
border-radius: 25px;
}
Szemléltetem is azért:
Csak az első sort alakítottam át. A többinek ugyan így lehet kódokat, vagy mindnek ugyan azt. Igazából hírnek is tudod használni, ha az első sorba címet, a másodikba dátumot, nevet, a harmadikba a szöveget írod.
Szegélyméretnek (border), majd 0-át adjatok meg, én azért hagytam meg, hogy lássátok, tobb sorom is van, 0 esetén ezek nem látszanak.
Ha nem így szeretnéd megoldani, hanem több oszlopot is tervezel, akkor az egy tr alá tartozó td-knek add ugyan azt a nevet. Vagy akár pont fordítva is csinálhatod, az első oszlopok egyformák, a másodikak megint másmilyenek. Ilyenkor minden második td-nek lesz azonos neve.
Ha nem érthető szívesen segítek benne.