Add Html Table in Blogger | Generate SEO Optimize Responsive Table Code

HTML Table Generator

Edit Table	Edit Table

Generated HTML

Paste this Style Code Once in your Html

                <style>
                    table {
                    width: 100%;
                     border-collapse: collapse;
                    }

                    th, td {
                        border: 1px solid black;
                        padding: 8px;
                        text-align: left;
                        text-wrap: balance;
                    }

                    th {
                        background-color: #f2f2f2;
                    }

                    @media screen and (max-width: 600px) {
                        table {
                            overflow-x: auto;
                            text-wrap: nowrap;
                            background-color: #fff;
                        }
                    }
                         tr:first-child {
                         background-color: #e4e4e4;
                         font-weight: bolder;
                        }
                    tr:hover {
                        background-color: #f1f1f1;
                          }
                          </style>

NOTE: After Pasting the Style Code, Dont need to Paste it again

After Pasting the Style Code Paste this Table Code

Preview