Q:

Display only part of table row

Can some one explain how to add row to table in html (tr)
but with only part of cells? The "hard" point of the question is that
the demand is that the un visible part - (two empty cells is the example) will be with the same settings of the table - same BG color, but without border lines
Thanks 

UPDATE:
You helped very much - but: what if we need now that un visibile cells will have the BG color of the general page, not table BG ?

A:

There's this cool property that people forget about called empty-cells
Use it!
Edit: I just saw that you edited your picture that includes background on empty cells. In that case you can use :empty selector to remove border from empty cells.
Using :empty example:

td {
  border : 1px solid black;
  background : green;
}

td:empty {
  border: 0;
}
<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
   <tr>
    <td>1</td>
    <td></td>
    <td></td>
  </tr>
</table>

Initial example:

   body {
  background: blue;
}

td {
  background: white;
  border : 1px solid black;
  empty-cells: hide;
}
<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
   <tr>
    <td>1</td>
    <td></td>
    <td></td>
  </tr>
</table>

A:

You would need to change the border-color and background-color using :empty selector or using JavaScript
Update: Using :empty selector. Thanks to @Paran0a

body {
  background-color: #dddddd;
}
table {
  border-collapse: collapse;
  background-color: palegreen;
}
td {
  border: 1px solid black;
  padding: 10px;
}
td:empty {
  border-color: #dddddd;
  background-color: #dddddd;
}
<table>
  <tr>
    <td>11</td>
    <td>12</td>
    <td>13</td>
  </tr>
  <tr>
    <td>21</td>
    <td></td>
    <td></td>
  </tr>
</table>

