Html表样式第一行用foreach

I have looked everywhere but couldn't find the right answer.

How can you style a html table, but only the first row. (And if possible als only the first column of the same row)

But now comes the tricky part, I use a foreach with a desc on it. So I retrieve the data from the database and not just have the data already in my table.

Here is what my code looks like:

<table class="table sortable" id="voteResults" name="voteResults">
  <thead>
    <tr>
      <th>Keuze</th>
      <th>Aantal punten</th>
    </tr>
  </thead>

  @foreach($lists as $i => $list)
    <tbody>
      <tr>
        <td>{{ $list->option }}</td>
        <td>{{ $list->points }}</td>
      </tr>
    </tbody>
  @endforeach
</table>

But how can I style only the first column? And if possible give an image or border-color with it. (Basicly every css

I have updated my code a little bit ($i =>), with this, you can easily get the first id of the column. Only the next problem is, I don't know how to style it with an if function.. (if $i === 1 give background-color: red, for example)

A CSS-only solution:

.table tbody:nth-child(2) tr:first-child td:first-child {
  border: 1px solid #cc0000;
}

selects the first row inside the body, then the first td inside that row.

https://developer.mozilla.org/en-US/docs/Web/CSS/%3Afirst-child

You can simply wrap it with a <div /> or give a class first to it:

<td class="first">{{ $list->option }}</td>

And in CSS:

.first {padding-left: 50px; background: url("50px-image.png") left top no-repeat;}

In pure PHP, I would do:

  $first = true;
  @foreach($lists as $list)
    <tbody>
      <tr>
        <td{{ ($first) ? ' class="first"' : "" }}>{{ $list->option }}</td>
        <td>{{ $list->points }}</td>
        {{ $first = false }}
      </tr>
    </tbody>
  @endforeach