Neko

Előfordul, hogy több táblázatot is használsz az oldaladon, és szeretnéd, hogy a táblázatok egységesen nézzenek ki, de ne kelljen őket külön-külön a modulban szerkeszteni. Erre találták fel a CSS kódot :)
Ez a leírás azt mutatja be, hogy egy kész táblázatot hogyan tudsz CSS-hez rendelni.

Az én táblázatomnak ez a kódja:

<table>
    <tbody>
        <tr>
            <td class="tartalom">
                <a href="//aranymeli.gportal.hu">LindaDesign</a><a href="//atispeedway.gportal.hu/"><br />
          </a>Linkes szöveg kinézete</td>
            <td class="tartalom">
                Tartalom kinézete a táblázatban </td>
            <td class="bg_tartalom">
                Háttér a cellának </td>
        </tr>
    </tbody>
</table>

Csak egy sima táblázatkód mindenféle értékek nélkül. Ugyanis az értékeket a CSS kódban adjuk meg. A te táblázatod kódjában annyit kell tenned, hogy a td után be kell másolnod egy class-t, amitől majd a CSS kód fog tudni rá hatni. Példa:  <td class="tartalom">értelemszerűen ide jön majd a szöveged</td>. A táblázat kódjában is kiemeltem, hogy miről is van szó pontosan. Nem muszáj neked is pont ezeket a class neveket adni. A tartalom helyett bármilyen másik szót is kitalálhatsz és azt írd oda. Csak arra vigyázz, hogy akkor, ami nálam a CSS kódban tartalom név alatt fut, azt neked át kell írnod arra, amit te adtál meg nevet.

<td class="bg_tartalom"> Mint látható van egy class, aminek nem csak simán tartalom a neve. Ez azért van, mert azt szerettem volna, hogy csak egy cellának legyen háttere, ne az összesnek így neki eltérő class nevet kellett megadni. Ennek a CSS-ben is külön kódot kell írni ilyenkor.

Egyébként általában az egyedi modulstílus is táblázatra épül, így azt is javaslom áttekinésre:
//aranymeli.gportal.hu/gindex.php?pg=35799649

A CSS kód

<style type="text/css">
/* táblázatos menü */
.tartalom { /* a cellák háttere, betűmérete, betűtípusa */
    font-family:Arial, Helvetica, sans-serif;
    background-color: #F3F3F3;
    padding: 6px;
    font-size: 15px;
    text-align: center;
    color: #3A3A3A;
    width: 205px;
}
.tartalom a:link, .tartalom a:visited { /* a cellában a linkek betűtípusa, betűmérete */
    font-family:Arial, Helvetica, sans-serif;
    font-weight: normal;
    color: #D32724;
}
.tartalom a:hover { /* a cellában a linkek betűtípusa, betűmérete, ha ráviszed az egeret */
    font-family:Arial, Helvetica, sans-serif;
    font-weight: normal;
    color: #000000;
}
.bg_tartalom { /* a háttérrel ellátott cella kinézete */
    color: #3A3A3A;
    text-shadow: 1px 1px 1px #ffffff;
    background-color: transparent;
    background-attachment: fixed;
    background-image: url(//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1261824073_45.gif);
    background-repeat: repeat;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    text-align: center;
    width: 205px;
}
-->
</style>

Súgó Még nincs hozzászólás.

Frissítés

Csak regisztrált felhasználók írhatnak hozzászólást.