Spartherm

Tables 

<div class="container">
    <div class="row">
        <div class="col-12 col-md-10 col-lg-8">
            <div class="desc desc-line">Structured table</div>
            <table>
                <thead>
                    <tr>
                        <th>Einbaumaße</th>
                        <th>Höhe</th>
                        <th>Breite</th>
                        <th>Tiefe</th>
                        <th>Gewicht</th>

                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td><strong>Modell 1</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 2</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 3</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 4</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 5</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
 
<div class="container">
    <div class="row">
        <div class="col-12 col-md-10 col-lg-8">
            <div class="desc desc-line">Structured table</div>
            <table>
                <thead>
                    <tr>
                        <th>Einbaumaße</th>
                        <th>Höhe</th>
                        <th>Breite</th>
                        <th>Tiefe</th>
                        <th>Gewicht</th>

                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td><strong>Modell 1</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 2</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 3</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 4</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                    <tr>
                        <td><strong>Modell 5</strong></td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>100 mm</td>
                        <td>30 kg</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
 
/* Kein Inhalt definiert. */
  • Inhalt: 
    td {
  .dark & {
    color: $white;
  }
}

table {
  width: 100%;
  max-width: 100%;
  thead {
    th {
      padding: .5em 0;
      font-size: 1rem;
      font-weight: $font-weight-medium;
      color: $accent;
      &:not(:first-child) {
        text-align: right;
      }
    }
  }
  tr {
    border-bottom: 1px solid $gray-300;
    .dark & {
      border-color: $gray-600;
    }
    td {
      padding: .5em 0;
      font-weight: $font-weight-lighter;
      &:not(:first-child) {
        text-align: right;
      }
      strong {
        font-weight: $font-weight-medium;
      }
    }
  }
}
  • URL: /components/raw/tables/tables.scss
  • Pfad Dateisystem: components\01-general\tables\tables.scss
  • Größe: 631 Bytes

Keine Notizen vorhanden.