Comment faire pour supprimer un élément de la liste de la frontière dans le bootstrap de groupe de la liste?

Je veux juste supprimer la première list-group-item dessus de la frontière:

<ul class="list-group">
  <li class="list-group-item borderless">Cras justo odio</li>
  <li class="list-group-item">Dapibus ac facilisis in</li>
  <li class="list-group-item">Morbi leo risus</li>
  <li class="list-group-item">Porta ac consectetur ac</li>
  <li class="list-group-item">Vestibulum at eros</li>
</ul>

.borderless li {
    border-top: none;
}

mais ne fonctionne pas, Quelqu'un peut m'aider, Merci d'avance!

InformationsquelleAutor pangpang | 2015-09-01
  1. 19

    Problème:

    L'actuel code que vous essayez est un descendant du sélecteur, et ne fonctionne que lorsque li est l'enfant de .borderless comme ci-dessous:

    <div class="borderless">
  <li></li>

    Solution:

    Essayer de le ci-dessous plusieurs sélecteur de classe qui sélectionne les éléments de la liste qui a une classe borderless.

    li.borderless { border-top: 0 none; }

    De sortie:

    CSS:

    li.borderless {
  border-top: 0 none;
}

    HTML:

    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<ul class="list-group">
  <li class="list-group-item borderless">Cras justo odio</li>
  <li class="list-group-item">Dapibus ac facilisis in</li>
  <li class="list-group-item">Morbi leo risus</li>
  <li class="list-group-item">Porta ac consectetur ac</li>
  <li class="list-group-item">Vestibulum at eros</li>
</ul>

    InformationsquelleAutor Manoj Kumar
  2. 19

    Dans le Bootstrap 4.0, vous pouvez simplement définir individuellement ou tous à l'aide de la frontière-* classe.

    <ul class="list-group">
    <li class="list-group-item border-0">One</li>
    <li class="list-group-item border-top-0">Two</li>
    <li class="list-group-item border-right-0">Three</li>
    <li class="list-group-item border-bottom-0">Four</li>
    <li class="list-group-item border-left-0">Five</li>
<ul />

    Bootstrap 4.0 Frontières Documententation

    InformationsquelleAutor Mike
  3. 7

    Vous pouvez profiter de la :nth-child() Sélecteur, de sorte que vous n'avez pas besoin d'ajouter de la sans frontières classe.

    Exemple:

    <ul class="list-group">
  <li class="list-group-item">Cras justo odio</li>
  <li class="list-group-item">Dapibus ac facilisis in</li>
  <li class="list-group-item">Morbi leo risus</li>
  <li class="list-group-item">Porta ac consectetur ac</li>
  <li class="list-group-item">Vestibulum at eros</li>
</ul>

    Le balisage

    .list-group li:nth-child(1){
  border-top: 0 none;
}

    Cheers!

    InformationsquelleAutor Sergio Marron
  4. 6

    Vous pouvez supprimer des bordures en déclarant frontière none (aucune), de l'élément de style. Veuillez voir ci-dessous

    <h2>Basic List Group</h2>
  <ul class="list-group">
    <li class="list-group-item" style="border: none">First item</li>
    <li class="list-group-item" style="border: none">Second item</li>
    <li class="list-group-item" style="border: none">Third item</li>
  </ul>
    InformationsquelleAutor SHINERAJ ARATHIL
  5. 1

    La classe de bootstrap .liste-groupe de chasse peut également être utilisé pour supprimer certains des frontières.

    https://getbootstrap.com/docs/4.0/components/list-group/#flush

    InformationsquelleAutor javapedia.net