Search code examples
bootstrap-table

Bootstrap, table-stripped class for only specified columns


I just want to apply table-stripped class to my 3 colums. Totally I have 5 colums, but 3 of them needs to be stripped. Any idea for that?

For example, I only want to apply table stripped to selected area below:

Example image


Solution

  • You can override first td element with style="background-color: white;"

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <table class="table table-condensed table-striped">
        <thead>
          <tr>
            <th>Firstname</th>
            <th>Lastname</th>
            <th>Email</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td style="background-color: white;">John</td>
            <td>Doe</td>
            <td>[email protected]</td>
          </tr>
          <tr>
            <td>Mary</td>
            <td>Moe</td>
            <td>[email protected]</td>
          </tr>
          <tr>
            <td style="background-color: white;">July</td>
            <td>Dooley</td>
            <td>[email protected]</td>
          </tr>
        </tbody>
      </table>
    </div>