Xin chào tất cả các bạn hôm nay mình sẽ hướng dẫn các bạn tạo bảng blogger đơn giản không thua kém gì với plugin wordpress. Tuy đơn giản nhưng rất hiệu quả.

1.Chuyển sang chế độ HTLM và dán vào bài viết mình muốn tạo

</tr> <tr>

</tr> </table>

2.Tạo một bảng trong Blogspot với HTML và CSS3

a. Đầu tiên Đăng nhập vào Blogger

b. Ở menu bên trái chọn Chủ đề ⇒ Chọn Chỉnh sửa HTML

c. Thêm mã dưới đây vào trước thẻ ]]></b:skin>

table {background-color: transparent;width: 100%;max-width: 100%;margin-bottom: 20px;}

table img{width: 100%;height: auto}

table.tr-caption-container{padding:0;border:none}

table td.tr-caption{font-size:12px;font-style:italic;}

table {border-spacing: 0;border-collapse: collapse;}

td, th {padding: 0;} th {text-align: left;}

.table {width: 100%;max-width: 100%;margin-bottom: 20px;}

.table a {text-decoration: none !important;}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td,.table > tbody > tr > td, .table > tfoot > tr > td {padding: 8px;line-height: 1.42857143;vertical-align: top;}

.table > thead > tr > th {background-color:#29958d;color:#fff;vertical-align: bottom;}

.table > thead > tr > th a {color:#fff !important;}

.table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > th, .table > caption + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > td, .table > thead:first-child > tr:first-child > td {border-top: 0;} .table > tbody > tr:nth-of-type(odd) {background-color: #f9f9f9;}

table col[class*="col-"] {position: static;display: table-column;float: none;}

table td[class*="col-"], table th[class*="col-"] {position: static;display: table-cell;float: none;}

.table-responsive {min-height: .01%;overflow-x: auto;}

@media screen and (max-width: 767px) { .table-responsive {width: 100%;margin-bottom: 15px;overflow-y: hidden;-ms-overflow-style: -ms-autohiding-scrollbar;} .table-responsive > .table {margin-bottom: 0;} .table-responsive > .table > thead > tr > th, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tfoot > tr > td {white-space: nowrap;} .table-responsive > .table-bordered {border: 0;} }

d. Lưu chủ đề lại và quay trở lại Bài đăng

e. Tiếp theo Tạo bài đăng mới chuyển sang chế độ soạn thảo HTML copy và dán mã sau vào vị trí muốn hiển thị bảng.

<thead>

<tr>

<th>Email</th>

</tr>

</thead>

<tbody>

<tr>

<td>Nguyễn Văn A</td>

<td>Bắc Giang, Việt Nam</td>

<td>nguyenvana@gmail.com</td>