asm maroc

TEL: 05 22 39 56 55
  • Accueil
  • ASM
    • Mot du Président
    • Nos Valeurs
    • Direction générale de l’ASM
    • Partenaires de l’ASM
  • Sidérurgie
    • Chiffres du secteur
    • Procédures de production
  • Publication
    • Lettre de l’acier
    • Publication ASM
    • Video ASM
  • Contact
  • Accueil
  • Style – Tables
juin 26, 2022

Style – Tables

Style – Tables

Default styles

For basic styling—light padding and only horizontal dividers—add the base class .table to any <table>.

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table>
  …
</table>

Optional classes

Add any of the following classes to the .table base class.

.table-striped

Adds zebra-striping to any table row within the <tbody> via the :nth-child CSS selector (not available in IE7-IE8).

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table>
  …
</table>

.table-bordered

Add borders and rounded corners to the table.

# First Name Last Name Username
1 Mark Otto @mdo
Mark Otto @TwBootstrap
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table>
  …
</table>

.table-hover

Enable a hover state on table rows within a <tbody>.

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table>
  …
</table>

.table-condensed

Makes tables more compact by cutting cell padding in half.

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
<table>
  …
</table>

Optional row classes

Use contextual classes to color table rows.

Class Description
.success Indicates a successful or positive action.
.error Indicates a dangerous or potentially negative action.
.warning Indicates a warning that might need attention.
.info Used as an alternative to the default styles.
# Product Payment Taken Status
1 TB – Monthly 01/04/2012 Approved
2 TB – Monthly 02/04/2012 Declined
3 TB – Monthly 03/04/2012 Pending
4 TB – Monthly 04/04/2012 Call in to confirm
...
  <tr class="success">
    <td>1</td>
    <td>TB - Monthly</td>
    <td>01/04/2012</td>
    <td>Approved</td>
  </tr>
...

Supported table markup

List of supported table HTML elements and how they should be used.

Tag Description
<table> Wrapping element for displaying data in a tabular format
<thead> Container element for table header rows (<tr>) to label table columns
<tbody> Container element for table rows (<tr>) in the body of the table
<tr> Container element for a set of table cells (<td> or <th>) that appears on a single row
<td> Default table cell
<th> Special table cell for column (or row, depending on scope and placement) labelsMust be used within a <thead>
<caption> Description or summary of what the table holds, especially useful for screen readers
<table>
  <caption>...</caption>
  <thead>
    <tr>
      <th>...</th>
      <th>...</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>...</td>
      <td>...</td>
    </tr>
  </tbody>
</table>

Share and Enjoy !

Shares

Laisser un commentaire Annuler la réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Articles récents

  • Communiqué de Presse 14 octobre 2020

    COMMUNIQUE DE PRESSE L’Association des Sidérurg...
  • la Lettre de l’acier

    ...
  • CHARTE DE BONNE CONDUITE

    ...

Commentaires récents

    Featured Posts

    • Communiqué de Presse 14 octobre 2020

      0 commentaires
    • la Lettre de l’acier

      0 commentaires
    • CHARTE DE BONNE CONDUITE

      0 commentaires

    Archives

    • octobre 2020
    • janvier 2020
    • décembre 2019

    Catégories

    • Actualité

    Méta

    • Connexion
    • Flux des publications
    • Flux des commentaires
    • Site de WordPress-FR

    GET A FREE QUOTE

    Please fill this for and we'll get back to you as soon as possible!

    ASM- Association des Sidérurgistes du Maroc
    Adresse: 65 Boulevard de la Corniche, Immeuble « A » le Yacht, bureau n° 85 – 3eme étage
    Tel / Fax: 05 22 39 56 55
    Mail: Contact@asm-maroc.ma
    CONTACT

    • SUIVEZ-NOUS
    asm maroc

    © 2020 All rights reserved. Buy king4media.

    HAUT
    LinkedIn

    Share

    Blogger
    Delicious
    Digg
    Email
    Facebook
    Facebook messenger
    Google
    Hacker News
    Line
    LinkedIn
    Mix
    Odnoklassniki
    PDF
    Pinterest
    Pocket
    Print
    Reddit
    Renren
    Short link
    SMS
    Skype
    Telegram
    Tumblr
    Twitter
    VKontakte
    wechat
    Weibo
    WhatsApp
    Xing
    Yahoo! Mail
    Powered by WP Socializer

    Copy short link

    Copy link
    Powered by WP Socializer