Tạo table html cho bài viết blogspot

Tạo table html cho bài viết blogspot hết sức đơn giản thông qua 4 bước sau : 

Hôm nay mình xin hướng dẫn các bạn cách tạo bảng trong blogger responsive đơn giản nhất đó là sử dụng tool tạo bảng trực tuyến.


Bước 1: Bạn truy cập vào https://www.tablesgenerator.com/html_tables

Bạn sẽ ra được 1 giao diện tảo bảng như hình bên dưới.





Bước 2: bạn tạo bảng với số lượng cột và dòng mong muốn ở table trên thanh công cụ ( dưới HTML Table Generator)




Ở phần Theme bạn có thể chọn có kiểu theme bạn muốn. sau khi có được bảng với số lượng cột và dòng mong muốn bạn tiến hành bước 3.


Bước 3: Điều text vào các ô trong bảng tương ứng thông tin bạn muốn (bạn chọn font chữ chăn trái phải, giữa in đậm trên thanh công cụ - giống với word)




Bước 4: Copy code đưa vào bài viết.



Bạn kích vào copy to clipboard để chọn code. Xong website ( blogspot) và vào bài viết bạn muốn chèn bảng vào chuyển sang phần HTML tìm đúng vị trí bạn muốn chèn bảng và paste code ngay dưới đoạn đó.
Để cho dễ trên phần viết của bài viết bạn nên tạo 1 đoạn text <!-- vi tri chen bảng--> trước khi chuyển qua HTML. Xong khi chèn bảng xong bạn xóa đoạn ghi chú đó đi.

Chúc bạn thành công! Nếu có các thắc mắc vui lòng để lại comment bên dưới bài viết để bên mình giải đáp cho bạn nha.


đây là code minh họa : 


 <style type="text/css">
.tg  {border-collapse:collapse;border-spacing:0;}
.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
  overflow:hidden;padding:10px 5px;word-break:normal;}
.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
.tg .tg-4r4c{color:#036400;font-family:Arial, Helvetica, sans-serif !important;;font-size:18px;font-weight:bold;text-align:center;
  vertical-align:top}
.tg .tg-235a{color:#cb0000;font-family:Arial, Helvetica, sans-serif !important;;font-size:18px;font-weight:bold;text-align:center;
  vertical-align:top}
.tg .tg-s88j{color:#ce6301;font-family:Arial, Helvetica, sans-serif !important;;font-size:18px;font-weight:bold;text-align:center;
  vertical-align:top}
.tg .tg-f0vw{color:#00009b;font-family:Arial, Helvetica, sans-serif !important;;font-size:18px;font-weight:bold;text-align:center;
  vertical-align:top}
</style>
<table class="tg">
<thead>
  <tr>
    <th class="tg-s88j">STT</th>
    <th class="tg-s88j">GIẤC MƠ CỦA BẠN</th>
    <th class="tg-s88j">LUẬN SỐ</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td class="tg-f0vw">1</td>
    <td class="tg-4r4c">Anh em gặp nhau</td>
    <td class="tg-235a">01</td>
  </tr>
  <tr>
    <td class="tg-f0vw">2</td>
    <td class="tg-4r4c">Ao hồ sông ngòi</td>
    <td class="tg-235a">38 - 93 - 54</td>
  </tr>
  <tr>
    <td class="tg-f0vw">3</td>
    <td class="tg-4r4c">Mơ Thấy Ao ước</td>
    <td class="tg-235a">25 - 52</td>
  </tr>
  <tr>
    <td class="tg-f0vw">4</td>
    <td class="tg-4r4c">Mơ Thấy Ba ba</td>
    <td class="tg-235a">76</td>
  </tr>
  <tr>
    <td class="tg-f0vw">5</td>
    <td class="tg-4r4c">Ba bố con ăn no</td>
    <td class="tg-235a">19</td>
  </tr>
  <tr>
    <td class="tg-f0vw">6</td>
    <td class="tg-4r4c">Mơ Thấy Bao diêm</td>
    <td class="tg-235a">65</td>
  </tr>
  <tr>
    <td class="tg-f0vw">7</td>
    <td class="tg-4r4c">Mơ Thấy Bia mộ</td>
    <td class="tg-235a">05-85</td>
  </tr>
  <tr>
    <td class="tg-f0vw">8</td>
    <td class="tg-4r4c">Biếu cụ</td>
    <td class="tg-235a">58 - 85</td>
  </tr>
  <tr>
    <td class="tg-f0vw">9</td>
    <td class="tg-4r4c">Mơ Thấy Biển</td>
    <td class="tg-235a">58</td>
  </tr>
  <tr>
    <td class="tg-f0vw">10</td>
    <td class="tg-4r4c">Biển cạn</td>
    <td class="tg-235a">58 - 53</td>
  </tr>
  <tr>
    <td class="tg-f0vw">11</td>
    <td class="tg-4r4c">Biển xanh</td>
    <td class="tg-235a">68 - 83 - 06</td>
  </tr>
  <tr>
    <td class="tg-f0vw">12</td>
    <td class="tg-4r4c">Bom đạn</td>
    <td class="tg-235a">22 - 62</td>
  </tr>
  <tr>
    <td class="tg-f0vw">13</td>
    <td class="tg-4r4c">Buồn phiền</td>
    <td class="tg-235a">42 - 32</td>
  </tr>
  <tr>
    <td class="tg-f0vw">14</td>
    <td class="tg-4r4c">Buồng cau</td>
    <td class="tg-235a">10 - 30 - 70 - 75</td>
  </tr>
  <tr>
    <td class="tg-f0vw">15</td>
    <td class="tg-4r4c">Buồng chuối</td>
    <td class="tg-235a">70 - 72</td>
  </tr>
  <tr>
    <td class="tg-f0vw">16</td>
    <td class="tg-4r4c">Bà chết sống lại</td>
    <td class="tg-235a">93 - 96</td>
  </tr>
  <tr>
    <td class="tg-f0vw">17</td>
    <td class="tg-4r4c">Bà chửa</td>
    <td class="tg-235a">09 - 29 - 39</td>
  </tr>
  <tr>
    <td class="tg-f0vw">18</td>
    <td class="tg-4r4c">Bàn cờ</td>
    <td class="tg-235a">14 - 54 - 74 - 94</td>
  </tr>
  <tr>
    <td class="tg-f0vw">19</td>
    <td class="tg-4r4c">Bàn thờ</td>
    <td class="tg-235a">15 - 43 - 46 - 95</td>
  </tr>
  <tr>
    <td class="tg-f0vw">20</td>
    <td class="tg-4r4c">Bàn thờ bị đổ</td>
    <td class="tg-235a">05-55</td>
  </tr>
</tbody>
</table>

Bình Luận Của Bạn

vungve.com không chấp nhận bình luận thiếu văn hóa

Mới hơn Cũ hơn