Thursday, May 3, 2012

How to add a TABLE to blogger.com, blogspot.com

Hi,

Today I got the need to insert a table in one of my posts, I am lazy, and usually get around it by using a screen shot of my data, usually it's in excel or a SQL table, so it's already formatted in a table...

But for that specific post, I decided to dig around how to insert a table into my post...

There are several ways...you need to be a little familiar on using HTML or use an HTML editor, such as Microsoft Expressions, which I'm using...

All what you need to do is to click on HTML from the top bar...




And that will allow you to edit the HTML behind you post..

If you have a HTML editor, your solution will be by creating the table on your HTML editor, copying the code and pasting in your HTML post.

Or use a sample snippet code such as


<style type="text/css">.nobrtable br { display: none }</style>
<div class="nobrtable">
<table border="2" bordercolor="#0033FF" style="background-color:#99FFFF" width="100%" cellpadding="3" cellspacing="3">
<tr style="background-color:#0033FF; color:#ffffff; padding-top:5px; padding-bottom:4px;">
<th>Table Header</th>
<th>Table Header</th>
<th>Table Header</th>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
</table>


Which will give you that table....

<><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><> <><><><><><><><><><>
Table HeaderTable HeaderTable Header
Table CellTable CellTable Cell
Table CellTable CellTable Cell
Table CellTable CellTable Cell


Please note that the above snippet has been taking from this article, which has a very good tutorial, step by step on how to create a table...


http://blogknowhow.blogspot.com/2011/01/how-add-table-blogger-blogspot-post.html

Hope that helps someone...

No comments:

Post a Comment