Az oldal menüje
 
Az év weboldala - 2013


Photoshop leírások

Ikonbázis
Galéria
 

 
Címkék

A blogban leggyakrabban használt címkék

 

Neko

CSS kód a G-Portálon
CSS kód a G-Portálon : Táblázat alakítása CSS kóddal

Táblázat alakítása CSS kóddal


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.

LindaDesign
Linkes szöveg kinézete
Tartalom kinézete a táblázatban Háttér a cellának

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>

Még nincs hozzászólás.
Csak regisztrált felhasználók írhatnak hozzászólást.
 

ANELIATH - varázslat és sárkányvér- Te ki leszel ebben a csavaroS Történetben? - SZEREPJÁTÉK    *****    ANELIATH - varázslat és sárkányvér- Te ki leszel ebben a csavaroS Történetben? - SZEREPJÁTÉK    *****    Gyere és csatlakozz a -Karstjäger- magyar airsoft csapatába!    *****    Szoba gyerekkel kiadó film meg tekinthetõ gportálon klikk ide!    *****    Simonyi ingatlan Debrecen Eladó luxus lakások, házak, telkek, üzletek, lakóparki ingatlanok. Simonyi ingatlan Debrecen    *****    Ajándékozz Horoszkópot! Lepd meg szeretteidet egy Személyre szóló asztrológiai elemzéssel és 1 éves elõrejelzéssel.    *****    A horoszkóp a lélek tükre,egyszer mindenkinek bele kell néznie, ehhez adok én,sok segítséget. Fordulj hozzám bizalommal!    *****    Az asztrológia sok segítséget ad az élet minden területén, de képzett, tapasztalt asztrológus kell hozzá, keress meg!    *****    Születési horoszkóp,3 év elõrejelzés,párkapcsolati elemzés,konzultáció.Tájékoztatás az oldalon! látogass,meg!!!    *****    | WATTPAD | Egy neves gimnázium, egy gazdag, arrogáns srác és egy ösztöndíjas lány nem mindennapi szerelme | WATTPAD |    *****    Bérkalkulátor    *****    Infrashape Horizontal fitness stúdió Debrecen    *****    Infrashape Horizontal fitness stúdió Debrecen    *****    too young and innocent | an aegyo queen | twice | neo culture technology    *****    LÉGY A MAGAD ASZTROLÓGUSA! Regisztrálj oldalamra és én segítelek elsajátítani az asztrológia tudományát!    *****    Tanuld nálam az asztrológiát teljesen ingyen, vagy kérj részletes asztrológiai elemzést &#8222;BECSÜLET KASSZÁS&#8221; alapon!    *****    Új lovas szerepjáték! * Új lovas szerepjáték! * Lépj be a lovak csodálatos világába! Nevelj te is nálunk!    *****    Születési horoszkóp,3 év elõrejelzés,párkapcsolati elemzés ingyenes konzultáció,tájékoztatás az oldalon! kattints ide!!!    *****    Bûbájos Boszorkák - Charmed - Hírek - Extrák - Érdekességek - Charmed - Bûbájos boszorkák - Sok - sok infó - Charmed -    *****    Pénzkeresés az Interneten! Csak is kipróbáld, tesztelt módszerekkel, melyek tényleg fizetnek!