How to Make Cool Responsive Tables on Blog, Simple and Easy!


A neat, easy-to-read blog appearance and always pay attention to the SEO element is an absolute thing to be applied and must be considered for every blogger.

Pampering blog visitors by creating quality content and elements of convenience is certainly a plus for a website in the eyes of visitors so that visitors will feel at home on our blog to get something they need.

In addition to correct spelling, blog content can also be neater when using tables for certain content needs such as specifications, comparisons, or other data so that it will be easier for visitors to understand.

In addition to correct spelling, blog content can also be neater when using tables for certain content needs such as specifications, comparisons, or other data so that it will be easier for visitors to understand.


What is a Table?

Table is a visual aid that serves to explain a fact or information briefly, clearly, and more interestingly than just presented in a narrative or using words. The presentation of information using tables is easier to read, so it is easier to conclude.

Then, how to make a good table that is also cool on the blog? Well, in this article we will discuss some ways to create tables on a blog. For that, let's see the full review below.


How to Create Tables in Blog Posts Manually

You can use this first method to create columns in blog posts using HTML, meaning that you can directly create tables on your blog via the HTML display menu.

  • First, please log in to your Blogger account, then make a post as usual
  • To install the table, please switch from Writing View mode to HTML View
  • Next, please use the following code.


<style>
table {background:#fff;width:100%;border:0px solid black}
th,td {height:10px;padding:5px;border:1px solid white}
th {background:blue;color:white}
</style>

<br />
<table>
    <tbody>
<tr>
            <th>colomn title 1</th>
            <th>colomn title 2</th>
            <th>colomn title 3</th>
        </tr>
<tr>
            <td>colomn Contain</td>
            <td>colomn Contain</td>
            <td>colomn Contain</td>
        </tr>
<tr>
             <td>colomn Contain</td>
            <td>colomn Contain</td>
             <td>colomn Contain</td>
   </tr>
<tr>
          <td>colomn Contain</td>
            <td>colomn Contain</td>
             <td>colomn Contain</td>
        </tr>
</tbody>
</table>
 Demo

The code above is an example of how to create a table with 3 columns in blogger, if you want to use it as a way to create 2 tables side by side in html then you just need to adjust the title and table of contents, please delete or add it as needed.

Information:

  • If you want to change the background or border color, you can change it to any other color you like in the code in the style attribute.
  • In the column title (marked in red), please fill in the column with your 3 titles.
  • In the column below it and so on (marked in green), please fill in and adjust it to the table of contents in your table.
  • If you want to add a new column either sideways or downwards, you can adjust it by adding another row below it or adjusting the order.

  • If you have finished, please preview it first, if you feel it is according to your wishes, please publish it.
  • Done

Well, that's our discussion of how to create a table on a blog. Hopefully it can be useful.

Posting Komentar

0 Komentar