我有一张要显示为HTML的发票。 我tranforming一个XML通过XSLT为HTML和我有基本上是:无法将表格设置为居中并在不同部分对齐
- 4表即我需要显示在2个不同的部分,一个在另一个
- 每个部分有2页以上的表,它们应居中涵盖大部分页面
- 表格也应该垂直对齐,以便不同部分中的表格处于相同的垂直位置。
我的第一个问题是,我不能让第三个表进入另一个部分,我会看到所有的表都在同一行,即使我使用div来分隔它们。这里下面
是代码:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<head>
<!-- CSS goes in the document HEAD or added to your external stylesheet -->
<style type="text/css">
.zui-table {
border: solid 1px #DDEEEE;
border-collapse: collapse;
border-spacing: 0;
font: normal 16px Arial, sans-serif;
margin-left:auto;
margin-right:auto;
float:left;
#top
{
width: 100%; /* si adatta in larghezza a alle
risoluzioni di tutti i browser */
height: 50px;
margin-bottom:10px;
h1 {
position: relative;
font-size: 30px;
font-family:Mistral;
margin-top: 0;
color: #b34d4d;
}
</style>
</head>
<body>
<div id="top"><h1><center>TEST CBF INVOICE</center></h1></div>
<div align="center">
<table class="zui-table zui-table-rounded">
<th colspan="2" class="zui-table thead th">INVOICE DETAILS</th>
<xsl:for-each select="//B0100_invoice_number_block">
<xsl:if test="position() = 2">
<tr>
<td>BILL ID</td>
<td><xsl:value-of select="D0101" /></td>
</tr>
<tr>
<td>START INVOICE PERIOD</td>
<td><xsl:value-of select="D0102" /></td>
</tr>
<tr>
<td>END INVOICE PERIOD</td>
<td><xsl:value-of select="D0103" /></td>
</tr>
<tr>
<td>INVOICE DATE</td>
<td><xsl:value-of select="D0104" /></td>
</tr>
<tr>
<td>DUE DATE</td>
<td><xsl:value-of select="D0105" /></td>
</tr>
</xsl:if>
</xsl:for-each>
</table>
<table class="zui-table zui-table-rounded">
<tr>
<th>ACCOUNT DETAILS</th>
</tr>
<xsl:for-each select="//B0600_mobile_number_block">
<xsl:if test="position() = 2">
<tr>
<td>ACCOUNT ID</td>
<td><xsl:value-of select="subs_id"/></td>
</tr>
<tr>
<td>MSISDN</td>
<td><xsl:value-of select="D0601_MSISDN"/></td>
</tr>
</xsl:if>
</xsl:for-each>
</table>
</div>
<div>
<table class="zui-table zui-table-rounded">
<tr>
<th>ACCOUNT Invoice Summary</th>
</tr>
<xsl:for-each select="//B09001/details">
<tr>
<td><xsl:value-of select="descr_en"/></td>
<td><xsl:value-of select="Amt"/></td>
</tr>
</xsl:for-each>
<xsl:for-each select="//B09002/details">
<tr>
<td><xsl:value-of select="descr_en"/></td>
<td><xsl:value-of select="Amt"/></td>
</tr>
</xsl:for-each>
</table>
<table class="zui-table zui-table-rounded">
<tr>
<th>Subscriber Invoice Summary</th>
</tr>
<xsl:for-each select="//BS09001/details">
<tr>
<td><xsl:value-of select="descr_en"/></td>
<td><xsl:value-of select="Amt"/></td>
</tr>
</xsl:for-each>
<xsl:for-each select="//BS09002/details">
<tr>
<td><xsl:value-of select="descr_en"/></td>
<td><xsl:value-of select="Amt"/></td>
</tr>
</xsl:for-each>
</table>
</div>
</body>
</html>