As you can probably guess from the title, this follows on (belatedly) from my previous
This is going to be short, sweet, and an example of something that you probably shouldn't do in production unless you know you're going to be able to fix it in the future when platform features change; but that doesn't mean it's not useful.
<apex:pageBlockTable> to get the job done.
The good news is that you can make any table fit in with the use of a few CSS classes. These are classes defined internally by Salesforce and prone to change at any time—in other words, using them is unsupported. That said, if Salesforce update the aging 'classic' UI (which I doubt) they'd most likely do so by changing the CSS, not by changing the generated markup.
So without further waffle, here's an HTML table that will look like it belongs in the regular, still used more often than not, 'classic' UI:
<table class="list"> <thead> <tr class="headerRow"> <th class="headerRow" scope="col"> One </th> <th class="headerRow" scope="col"> Two <apex:image value="/s.gif" styleClass="helpIcon" title="Drag a trainer here to assign them to all events. To assign a trainer to an individual event, drag their name to that event."/> </th> </tr> </thead> <tbody> <tr class="dataRow"> <td>Data one</td> <td>Data two</td> </tr> </tbody> </table>
As you can see there are a few simple classes to assign, and the second header shows how to implement the little help icon with tooltip text that's seen on many of the standard pages. Not rocket science, but handy.