Border some cells in table via CSS

Question

In a very basic table I would like to put a border around some specific cells. I created for instance this table:

<?php
echo '<link rel="stylesheet" type="text/css" href="style1tt.css">';

echo '<table>';
echo '<tr>
    <th>name</th>
    <th>score</th>
    <th>position</th></tr>';
echo '<tr>
    <td>Bart</td>
    <td>189</td>
    <td>2</td></tr>';           

echo '<tr>
    <td>Shirley</td>
    <td>211</td>
    <td>1</td></tr>';

echo '<tr>
    <td>Paul</td>
    <td>109</td>
    <td>3</td></tr>';
echo '</table>';    
?>

I would like to put a border around the cells containing "Bart" and "Shirley": 1 single border around both cells. So for the cell containing "Bart" I would like to have the left-border, the upper-border and the left-border. For the cell containing "Shirley" I would like to have the right-border, left-border and lower-border.

I suppose I need to specify this in my style1tt.css file, and then make the right references in my table elements?

I'm an absolute beginner with CSS, I went through some basic CSS courses/introductions but could not find an (understandable) solution to my problem.

Any help/input would be greatly appreciated. Thanks, Tim

Answer 1

First add some classes to the cells you want to address.

echo '<tr>
    <td class="border-tophalf">Bart</td>
    <td>189</td>
    <td>2</td></tr>';           

echo '<tr>
    <td class="border-bottomhalf">Shirley</td>
    <td>211</td>
    <td>1</td></tr>';

Now you can add css to the specific classes:

.border-tophalf{
  border: 1px solid #000; /* adds full border */
  border-bottom: none; /* removes bottom border */
}
.border-bottomhalf{
  border: 1px solid #000; /* adds full border */
  border-top: none; /* removes top border */
} 

Answer 2

//add class in td
.top{
  border-bottom: 1px solid #000;
}
.bottom{
  border-top: 1px solid #000;
}