Style an HTML table to look like a Spreadsheet like Google Docs

I am trying to create a simple spreadsheet (with a REST/JSON back end) that looks like the Google Docs spreadsheet (or Excel). I have a working model which uses HTML input boxes and Select boxes. Simple HTML spreadsheet

Is there a way to style this so that it looks like a real spreadsheet and uses "ContentEditable=true" and also to handle the Tab keys?

How do you turn a table into a Google Spreadsheet?

All you have to do is select the data that belong in your table, and then click “CTRL + T” (Windows) or “Apple + T” (Mac). Alternatively, there's a Format as Table button in the standard toolbar. Unfortunately, Sheets doesn't have a “one stop shop” for Tables.

You can try with this: https://mindmup.github.io/editable-table/ it works with bootstrap, allows edit content, its like a excel spreadsheet but works on a normal HTML table.

It looks like this img: Image editableTableWidget. Obviusly you can custom the style in css.