[英]Generation of an HTML div based table with column header spanning several (but not all) cells
Given a XML like this fragment (which will be generated), I need to generate a web page using div entries, based on XSLT 1.0, which looks like the one below: 给定像这样的片段(将要生成)的XML,我需要使用基于XSLT 1.0的div条目生成一个网页,如下所示:
<div class="rTable">
<div class="rTableRowS">
<div class="hCell">SIT</div>
</div>
<div class="rTableRowS">
<div class="rTableCellS">Header 1</div>
<div class="rTableCellS">Header 2</div>
<div class="rTableCellS">Header 3</div>
<div class="rTableCellS">Header 4</div>
</div>
<div class="rTableRowQ">
<div class="rTableCellQ">a1</div>
<div class="rTableCellQ">single</div>
<div class="rTableCellQ">a2</div>
<div class="rTableCellQ">secondary</div>
<div class="rTableCellQ">a3</div>
<div class="rTableCellQ">single</div>
<div class="rTableCellQ">a4</div>
<div class="rTableCellQ">secondary</div>
</div>
<div class="rTableRowS">
<div class="rTableCellS">header 5</div>
<div class="rTableCellS">header 6</div>
<div class="rTableCellS">header 7</div>
<div class="rTableCellS">header 8</div>
</div>
<div class="rTableRowQ">
<div class="rTableCellQ">b5</div>
<div class="rTableCellQ">single</div>
<div class="rTableCellQ">b6</div>
<div class="rTableCellQ">secondary</div>
<div class="rTableCellQ">b7</div>
<div class="rTableCellQ">single</div>
<div class="rTableCellQ">b8</div>
<div class="rTableCellQ">secondary</div>
</div>
Desired output (look and feel): 所需的输出(外观):
SIT
Header 1 ¦ Header 2 ¦ Header 3 ¦ Header 4
a1 ¦ single ¦ a2 ¦ secondary ¦ a3 ¦ single ¦ a4 ¦ secondary
Header 5 ¦ Header 6 ¦ Header 7 ¦ Header 8
b5 ¦ single ¦ b6 ¦ secondary ¦ b7 ¦ single ¦ b8 ¦ secondary
and so on. 等等。
What is an easy XSLT1.0 transformation to achieve the column matching (based on div). 什么是实现列匹配(基于div)的简单XSLT1.0转换。 I can adapt the input XML to some level, such as changing the class entries.
我可以将输入XML调整到某个级别,例如更改类条目。
使用具有嵌套display = table条目的div解决:一行包含再次包含表的单元格。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.