Ne pouvez pas obtenir .table rayé de la classe au travail

Je ne peux pas obtenir ma table de bandes de classe pour travailler avec mon Bootstrap cadre.

Voici un aperçu en direct de ma table. J'ai l' .table-striped classe dans mon code HTML, mais ce n'est pas à l'affiche sur la sortie.

Ce que je fais mal?

  • Pas sûr de ce que tu veux dire, je vois stipes?
  • C'est parce que je l'ai corrigé:) Merci!
  • Pour référence future, c'est mieux de poster des exemples de code plutôt qu'un lien vers un site en ligne qui est susceptible de changer dans le futur, en faisant cette question pour le moins utile à d'autres.
  • Où est ton code?
  • Ajouter mon code ici depuis que j'ai eu le même problème mais je n'avais pas de code à regarder dans la question. lang-html <table class="table table-striped" id="process-monitor-data"><br /> <tr><br /> <th>Process <br />Index</th><br /> .......<br /> </tr><br /> <tr v-for="item in ProcessMonitorData" v-if="IsRowVisible(item)" :item="item"><br /> <td>{{item.ProcessMonitorIndex}}</td><br /> ...<br /> </tr><br /> </table>
InformationsquelleAutor redshift | 2013-05-26
  1. 26

    Votre code html est mal. Vous avez un tbody balise pour chaque ligne, mais le css pour .table-striped s'appuie sur tr:nth-child() de style les lignes différemment:

    .table-striped tbody > tr:nth-child(odd) > td,
.table-striped tbody > tr:nth-child(odd) > th

    Fixer votre html, de sorte que vous avez un seul tbody à parcourir.

    Aussi, j'ai vu à la fois le bootstrap.css et bootstrap.min.css dans vos ressources. Un seul suffit.

    • Merci travaillé. Merci!
    InformationsquelleAutor mathieugagne
  2. 2

    Le problème est avec votre table de balisage. Vous avez chaque ligne wrappped dans une balise tbody et selon le bootstrap, documentation:

    Ajoute zebra-entrelacement de toute ligne de tableau à l'intérieur de la via :nth-child sélecteur CSS (pas disponible dans IE7-8).

    Donc, si vous allez à travers et supprimer toutes les tbody balises de sorte qu'il n'est qu'un au début de votre corps de table et un à la fin, il devrait fonctionner comme prévu.

    InformationsquelleAutor Kristy
  3. 0

    Juste un complément d'information, la ng-repeat devrait être sur: 

    <tr> inside <tbody>:
    <table class="table table-striped">
    <thead>
        <tr>
            <th class="col-md-1"></th>
            <th class="col-md-5"></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="v1 in v">
            <td><span class="glyphicon glyphicon-trash"/></td>
            <td>{{v1.name}}</td>
        </tr>
    </tbody>
</table>
    InformationsquelleAutor Lanlan82