Partage
  • Partager sur Facebook
  • Partager sur Twitter

Tableau avec bordure avec bootstrap

tableau

GregoireYakeu
    21 juillet 2017 à 15:15:50

    Bonjour à tous j'ai un problème j'aimerai faire un tableau en utilisant boostrap, le problème c'est que ça me donne un tableau sans bordures

    J'aimerai avoir un tableau avec bordure

    <table class="table table-bordered table-striped table-condensed ">
   <form>

  <!-- En-tête du tableau -->
       <tr>
      <th> <input type="checkbox" name="" /></th>
           <th>Cni<span class="glyphicon glyphicon-arrow-up"></span></th>
           <th>Nom</th>
           <th>Prenom</th>
           <th>Sexe</th>
           <th>Date Naissance</th>
           <th>Email</th>
           <th>Telephone</th>
           <th>Langue</th>
           <th>Centre Examen</th>
           <th>Session</th>
           <th>Status</th>
           <th>Actions</th>
       </tr>
   

   

   <!-- Corps du tableau -->
       <tr class="gris">
           <td><input type="checkbox" name="" /></td>
           <td >345545 </td>
           <td class="text-primary ">Steve</td>
            <td class="text-primary">M</td>
           <td>Masculin</td>
           <td>13/07/2017</td>
            <td>steve@gmail.com</td>
           <td>698943412</td>
           <td>English</td>
            <td>Maroua</td>
           <td>2017</td>
           <td class="Status-premier">VALIDE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
       <tr>
           <td><input type="checkbox" name="" /></td>
            <td>3164614</td>
           <td class="text-primary">test</td>
           <td class="text-primary">mljbilbin</td>
            <td>Féminin</td>
           <td>22/06/1999</td>
           <td>48lji@uip.com</td>
            <td>34984646</td>
           <td>Français</td>
           <td>MAROUA</td>
            <td>2017</td>
           <td class="text-rouge">REJETE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
       <tr class="gris">
           <td><input type="checkbox" name="" /></td>
           <td>1258962</td>
           <td class="text-primary">HOUZOU</td>
            <td class="text-primary">Samtou</td>
           <td>Masculin</td>
           <td>28/07/1982</td>
            <td>sam@jk.com</td>
           <td>449616461</td>
           <td>English</td>
            <td>DOUALA C1</td>
           <td>2017</td>
           <td class="non_traite">NON TRAITE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
       <tr>
           <td><input type="checkbox" name="" /></td>
           <td>78549</td>
           <td class="text-primary">HOUZOU</td>
            <td class="text-primary">Licao</td>
           <td>Masculin</td>
           <td>31/10/1984</td>
            <td>ha@ui.com</td>
           <td>9658246</td>
           <td>Fraçais</td>
            <td>YAOUNDE</td>
           <td>2017</td>
           <td class="non_traite">NON TRAITE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
       <tr class="gris">
           <td><input type="checkbox" name="" /></td>
           <td>1245</td>
           <td class="text-primary">KIMAZI</td>
           <td class="text-primary">Louise</td>
            <td>Feminin</td>
           <td>12/08/1991</td>
           <td>ji@jl.com</td>
            <td>14946649</td>
           <td>English</td>
           <td>MAROUA</td>
            <td>2017</td>
           <td class="non_traite">NON TRAITE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
       <tr>
           <td><input type="checkbox" name="" /></td>
           <td>123658</td>
           <td class="text-primary">Salut</td>
            <td class="text-primary">Samson</td>
           <td>Masculin</td>
           <td>12/07/1994</td>
            <td>ha@ui.com</td>
           <td>2589643</td>
           <td>Français</td>
            <td>YAOUNDE</td>
           <td>2017</td>
           <td class="non_traite">NON TRAITE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
        <tr class="gris">
           <td><input type="checkbox" name="" /></td>
           <td>4586</td>
           <td class="text-primary">TATA BRO</td>
            <td class="text-primary">josé Hema</td>
           <td>Féminin</td>
           <td>12/10/1995</td>
            <td>joi@gh.com</td>
           <td>12569853</td>
           <td>English</td>
            <td>YAOUNDE</td>
           <td>2017</td>
           <td class="non_traite">NON TRAITE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
        <tr>
           <td><input type="checkbox" name="" /></td>
           <td>649461</td>
           <td class="text-primary">Tokos</td>
            <td class="text-primary">LIBRON JAMES</td>
           <td>Masculin</td>
           <td>11/07/1995</td>
            <td></td>
           <td>344649</td>
            <td>Français</td>
           <td>DOUALA C2</td>
           <td>2017</td>
           <td class="non_traite">NON TRAITE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
        <tr class="gris">
           <td><input type="checkbox" name="" /></td>
           <td>564654666</td>
           <td class="text-primary">K Samuel</td>
            <td class="text-primary">Samuel</td>
           <td>Masculin</td>
           <td>11/05/2017</td>
            <td>yde@gmail.com</td>
           <td>13231231</td>
           <td></td>
            <td>DOUALA C1</td>
           <td>2017</td>
           <td class="Status-premier">VALIDE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
        <tr>
           <td><input type="checkbox" name="" /></td>
           <td>234151324</td>
           <td class="text-primary">Kamen</td>
            <td class="text-primary">Guy</td>
           <td>Masculin</td>
           <td>01/01/2012</td>
            <td>yde@gmail.com</td>
           <td>4533553</td>
           <td></td>
            <td>DOUALA C1</td>
           <td>2017</td>
           <td class="Status-premier">VALIDE</td>
            <td class="couleur"><select name="pays" id="pays">

           <option value="japon">Actions</option>

       </select></td>
       </tr>
   
   </form>
</table>

            </div>

        </div>
        <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>

    Merci

    • Partager sur Facebook
    • Partager sur Twitter
    Lamecarlate
    • HTML / CSS
      21 juillet 2017 à 15:56:03

      Bonjour,

      il faut lire la doc de Bootstrap : https://getbootstrap.com/css/#tables

      • Partager sur Facebook
      • Partager sur Twitter

      Pas d'aide concernant le code par MP, le forum est là pour ça :)

      Tableau avec bordure avec bootstrap

      × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
      × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
      • Editeur ●
      • Markdown