I think it is easiest to have a header row separate from your repeater. Just place it right above the repeater widget. You can group them or include both in a dynamic panel if you need to show/hide or move it around as one unit.
The alternative is to include the column header titles as the first row in your repeater and if needed, style them differently using a conditional case in the Item Loaded event: "IF [[Item.isFirst]] equals “true” {apply header style} " … You have several options for how to apply that header style, including defining a “selected” style (in your example: bold, larger font, gray background, black border on bottom), or creating a dynamic panel with a default state (for your data) and “header” state, where you style widgets for your header row. This latter approach is better if your header row is to be taller than the data rows, because the height of the row will automatically adjust based on the height of the dynamic panel (as long as you check on the options for “Fit to Content in HTML” in the repeater’s style and “Fit to Content” in the dynamic panel.) Also be sure to note your [[Item.index]] values will be increased by 1 if you need to account for number of rows in your repeater. Sorting and filtering become more difficult to handle as well because you need to ignore your first (header) row. Like I said, easier to have header as a separate set of widgets outside your repeater.
If you upload your .rp source file I’d be happy to try applying an example for you.
