LÀM WEB‎ > ‎MẸO LÀM WEB‎ > ‎

Làm sao để chuyển file excel thành bảng html?

Câu hỏi chung của mọi người khi muốn chuyển dữ liệu trong file excel thành bảng html để có thể đăng tải trên các trang web là:

Có cách nào xuất file excel thành bảng html không?

Không có cách xuất file excel trực tiếp thành định dạng bảng html nhưng chúng ta có thể xuất dưới dạng trang web đơn, sau đó dùng phần mềm soạn thảo để biên tập lại mã html xấu xí vừa xuất ra. Dưới đây là các bước.

Bước 1: Mở file excel, nhấp chuột vào Office Button (góc trên bên trái), chọn "Save as" => "Other format", ở bảng hiện ra chọn tiếp loại file lưu là "Single File Web Page (*.mht; *.mhtml)". Ví dụ bạn lưu file thành Book1.mht.

Bước 2: Mở file Book1.mht bằng phần mềm soạn thảo văn bản (ví dụ Notepad, Notepad++). Bạn sẽ thấy những nội dung "rác" rất nhiều, nhưng hãy copy riêng đoạn mã html của bảng ra, ví dụ như sau:
<table border=3D0 cellpadding=3D0 cellspacing=3D0 width=3D336 style=3D'bord=
er-collapse:
 collapse;table-layout:fixed;width:252pt'>
 <col width=3D161 style=3D'mso-width-source:userset;mso-width-alt:5888;widt=
h:121pt'>
 <col width=3D175 style=3D'mso-width-source:userset;mso-width-alt:6400;widt=
h:131pt'>
 <tr height=3D20 style=3D'height:15.0pt'>
  <td height=3D20 width=3D161 style=3D'height:15.0pt;width:121pt'>Month</td>
  <td width=3D175 style=3D'width:131pt'>Income</td>
 </tr>
 <tr height=3D20 style=3D'height:15.0pt'>
  <td height=3D20 align=3Dright style=3D'height:15.0pt'>1</td>
  <td align=3Dright>1000</td>
 </tr>
 <tr height=3D20 style=3D'height:15.0pt'>
  <td height=3D20 align=3Dright style=3D'height:15.0pt'>2</td>
  <td align=3Dright>2000</td>
 </tr>
 <tr height=3D20 style=3D'height:15.0pt'>
  <td height=3D20 align=3Dright style=3D'height:15.0pt'>3</td>
  <td align=3Dright>3000</td>
 </tr>
 <![if supportMisalignedColumns]>
 <tr height=3D0 style=3D'display:none'>
  <td width=3D161 style=3D'width:121pt'></td>
  <td width=3D175 style=3D'width:131pt'></td>
 </tr>
 <![endif]>
</table>

Bước 3: Xóa hết những phần không cần thiết, ví dụ: Phần đầu bảng và những đoạn code như:
<![if supportMisalignedColumns]>
....
<![endif]>
 height=3D0 style=3D'display:none'
Chỉ cần giữ lại các thẻ <table>, <tr>, <td> là được.
Để cho nhanh chúng ta có thể dùng chức năng "Thay thế" của phần mềm soạn thảo (Replace, Ctrl + H) thay những chỗ lặp lại bằng một ký tự rỗng (empty).
Chúng ta sẽ thu được đoạn mã sau sau khi dọn dẹp:
<table>
 <tr>
  <td>Month</td>
  <td>Income</td>
 </tr>
 <tr>
  <td>1</td>
  <td>1000</td>
 </tr>
 <tr>
  <td>2</td>
  <td>2000</td>
 </tr>
 <tr>
  <td>3</td>
  <td>3000</td>
 </tr>
</table>

Mã trên sẽ cho bảng như sau:
Month Income
1 1000
2 2000
3 3000

Bước 4: Thêm định dạng cho bảng
<div align="center">
<table border="1" style="border-collapse:collapse;border:1px solid #c3c3c3;width:60%">
<tbody>
 <tr>
  <td style="background-color:#E41B17;color:white;text-align:center" width="30%">Month</td>
  <td style="background-color:#E41B17;color:white;text-align:center" width="30%">Income</td>
 </tr>
 <tr>
  <td>1</td>
  <td>1000</td>
 </tr>
 <tr>
  <td>2</td>
  <td>2000</td>
 </tr>
 <tr>
  <td>3</td>
  <td>3000</td>
 </tr>
</tbody>
</table>
</div>
Xem bảng:
Month Income
1 1000
2 2000
3 3000

Comments