Suppose the following XML feed listing a set of users:
<?xml version="1.0" encoding="UTF-8"?> <users> <user> <id>1</id> <login>lo</login> <email>laurent@sillysmart.org</email> </user> <user> <id>2</id> <login>flo</login> <email>florian@sillysmart.org</email> </user> <user> <id>3</id> <login>charly</login> <email>charly@sillysmart.org</email> </user> </users>
The following css :
table.bo_table_visible {
border:1px solid #000;
border-spacing: 0px;
margin-top:10px;
margin-bottom:10px;
}
table.bo_table_visible tr.summary th {
background:#2E2D2D;
color:#E45A49;
}
table.bo_table_visible tr td {
padding:0 10px;
}
table.bo_table_visible tr.even td, table.bo_table_visible tr th {
background-color:#FFF;
color:#000;
}
table.bo_table_visible tr.even:hover td {
background-color:#FF8ABC;
color:#FFF;
}
table.bo_table_visible tr.odd td {
background-color:#DFDFDF;
color:#000;
}
table.bo_table_visible tr.odd:hover td {
background-color:#64B8FE;
color:#FFF;
}
Simply apply the XSL script below to apply styles to your list of users:
<!--
- Apply css with XSL
-->
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:php="http://php.net/xsl" version="1.0">
<xsl:output method="xml" encoding="UTF-8" indent="yes" />
<xsl:template match="root">
<html>
<head></head>
<body>
<table class="bo_table_visible">
<tr>
<th>Id</th>
<th>Login</th>
<th>Email</th>
</tr>
<xsl:for-each select="//users/user">
<xsl:variable name="cssClass">
<xsl:choose>
<xsl:when test="(position() mod 2) = 0">
even
</xsl:when>
<xsl:otherwise>
odd
</xsl:otherwise>
</xsl:choose>
</xsl:variable>
<tr class="{$cssClass}">
<td><xsl:value-of select="id" /></td>
<td><xsl:value-of select="login" /></td>
<td><xsl:value-of select="email" /></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Will produce :
| Id | Login | |
|---|---|---|
| 1 | lo | laurent@sillysmart.org |
| 2 | flo | florian@sillysmart.org |
| 3 | charly | charly@sillysmart.org |
