☰ Dersleri Göster

table etiketi - Tablo Oluşturma

Bu derste web sayfalarımız içerisinde kullanılan table etiketi ve table etiketinin alt etiketlerini öğreneceksiniz.

 

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Table etiketi - Tablo Oluşturma</title>
</head>

<body>

    <table border="1">
        <thead>
            <tr>
                <th>
                    Kırmızı
                </th>
                <th>
                    Yeşil
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td colspan="2" bgcolor="red" style="height:50px;">

                </td>
            </tr>
            <tr>
                <td bgcolor="red" style="height:50px;"></td>
                <td  rowspan="2" bgcolor="green" style="height:50px;"></td>
            </tr>
            <tr>
                    <td bgcolor="red" style="height:50px;"></td>
            </tr>
        </tbody>
    </table>

    <table border="1">
        <thead>
            <tr>
                <th>
                    Kırmızı
                </th>
                <th >
                    Mavi
                </th>
                <th>
                    Yeşil
                </th>
                
            </tr>
        </thead>
        <tbody>
            <tr>
                <td style="height: 30px;" bgcolor="red">

                </td>
                <td style="height: 30px;" bgcolor="blue">

                </td>
                <td rowspan="2" style="height: 30px;" bgcolor="green">

                </td>      
            </tr>
            <tr>
                <td>
                    Kalem
                </td>
                <td>
                    Gökyüzü
                </td>
                <td>
                    Çimen
                </td>

            </tr>
        </tbody>
    </table>
    

    <table border="4" style="width:100%;">
        <thead>
            <tr bgcolor="yellow">
                <th>
                    Takım Ismi
                </th>
                <th>
                    W
                </th>
                <th>
                    D
                </th>
                <th>
                    L
                </th>
                <th>
                    Puan
                </th>
            </tr>
        </thead>
        <tbody>
            <tr bgcolor="blue">
                <td>
                    Galatasaray
                </td>
                <td>
                    4
                </td>
                <td>2

                </td>
                <td>
                    1
                </td>
                <td>12</td>
            </tr>
            <tr bgcolor="blue">
                <td>
                    Fenerbahçe
                </td>
                <td>
                    3
                </td>
                <td>
                    3
                </td>
                <td>
                    1
                </td>
                <td>
                    12
                </td>
            </tr>
            <tr bgcolor="turquoise">
                <td>
                    Beşiktaş
                </td>
                <td>
                    2
                </td>
                <td>
                    4
                </td>
                <td>
                    1
                </td>
                <td>
                    10
                </td>
            </tr>
            <tr bgcolor="turquoise">
                <td>
                    Trabzonspor
                </td>
                <td>
                    1
                </td>
                <td>5

                </td>
                <td>
                    1
                </td>
                <td>
                    8
                </td>
            </tr>
        </tbody>

    </table>
</body>

</html>