Visualizzazione dei risultati da 1 a 4 su 4
  1. #1
    Utente di HTML.it
    Registrato dal
    Oct 2008
    Messaggi
    11

    Sfondo ultima riga di una colonna.

    Salve a tutti.

    ho una tabella con lo sfondo alternato.

    Vorrei eliminare lo sfondo all'ultima riga e lasciare solo il bordo.
    Non riesco.
    Qualcuno può aiutarmi?


    image001.png

    image002.png

    codice:
    .table-striped>tbody>tr:nth-child(odd)>td,
    .table-striped>tbody>tr:nth-child(odd)>th {
      background: rgb(255, 253, 219);
    }
    
    <table class="table table-sm table-striped">
      <thead>
      <tr>
        <th>
          AAAAAAAAAAAAAAA
        </th>
      </tr>
      </thead>
     
      <tbody>
      <tr>
        <td>
          xxxxxxxxxxxxxx
        </td>
      </tr>
      <tr>
        <td>
          yyyyyyyyyyyyyy
        </td>
      </tr>
     
        <tr style="background-color: white;">
          <td> </td>
        </tr>
      </tbody>
    </table>
    Ultima modifica di KillerWorm; 18-12-2020 a 19:11 Motivo: aggiunti tag code

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Ciao, come puoi notare da quella regola, il background è stato applicato agli elementi td e th, mentre tu lo hai applicato al tr (che li contiene).

    Puoi quindi applicare lo style sul tag, come hai fatto, ma sul td, non sul tr. Oppure puoi aggiungere, dopo quella già definita, una nuova regola del tipo:
    codice:
    table-striped>tbody>tr:last-child>td {  background: white;
    }
    .
    O, ancora, ridefinire quella stessa regola escludendo l'ultima riga con un not(), in questo modo:
    codice:
    table-striped>tbody>tr:nth-child(odd):not(:last-child)>td,
    .table-striped>tbody>tr:nth-child(odd)>th {
    background: rgb(255, 253, 219);
    }
    Prova e fai sapere.

  3. #3
    Utente di HTML.it
    Registrato dal
    Oct 2008
    Messaggi
    11
    grazie mille.

    ho provato il codice
    codice:
    table-striped>tbody>tr:nth-child(odd):not(:last-child)>td,
    .table-striped>tbody>tr:nth-child(odd)>th {
    background: rgb(255, 253, 219);
    }


    Funziona!!
    Ultima modifica di KillerWorm; 18-12-2020 a 19:12 Motivo: aggiunti tag code

  4. #4
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Bene
    Buon proseguimento.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.