Use HTML and CSS to quickly export data to Excel

In applications, you may need to export data flat files from the system or database, usually to txt, csv, or excel. Txt and csv are generally used for data exchange between systems,

Excel generally has a good display effect, which can be exported according to a certain template, and no typographical layout is required for export. It is easy to use. If it is used as a report, excel files are generally exported.

However, using the com component to export data to Excel is slow. Another way to generate an excel file is to use html and css to quickly export data and set styles. This method has two advantages: 1 is fast, 2 is not needed to install excel support.

Html can be directly converted to excel. There are two main points: first, the table line is displayed, and no table is displayed when the excel file is exported through the Gridview in ASP.net.

Second, set the data format.

1. display the table line:
Add the following code to the html head Tag:

<Xml>
<X: ExcelWorkbook>
<X: ExcelWorksheets>
<X: ExcelWorksheet>
<X: Name> worksheet title </x: Name>
<X: WorksheetOptions>
<X: Print>
<X: ValidPrinterInfo/>
</X: Print>
</X: WorksheetOptions>
</X: ExcelWorksheet>
</X: ExcelWorksheets>
</X: ExcelWorkbook>
</Xml>

Ii. Set the data format:
Add css definition to head

<Style type = "text/css">
. Spercent
{
Background-color: # ffff99;
Mso-number-format: 0.00%;
}
</Style>

Add: mso-number-format to css to define the data format. You can view the custom format in excel. For details, refer:
Mso-number-format: "0" NO Decimals
Mso-number-format: "0 \. 000" 3 Decimals
Mso-number-format: "\#\,\#\# 0 \. 000" Comma with 3 dec
Mso-number-format: "mm \/dd \/yy" Date7
Mso-number-format: "mmmm \ d \, \ yyyy" Date9
Mso-number-format: "m \/d \/yy \ h \: mm \ AM \/PM" D-T AMPM
Mso-number-format: "Short Date" 01/03/1998
Mso-number-format: "Medium Date" 01-mar-98
Mso-number-format: "d \-mmm \-yyyy" 01-mar-1998
Mso-number-format: "Short Time" 5: 16
Mso-number-format: "Medium Time" 5:16 am
Mso-number-format: "Long Time" 5: 16: 21: 00
Mso-number-format: "Percent" Percent-two decimals
Mso-number-format: "0%" Percent-no decimals
Mso-number-format: "0 \. E + 00" Scientific Notation
Mso-number-format: "\ @" Text
Mso-number-format :"\#\??? \/??? "Fractions-up to 3 digits (312/943)

The exported excel file can be opened directly through excel. The effect is as follows:

Complete code:

ALL Code