Home TEI-P5: how to add a css classname to html table tag?
Reply: 2

TEI-P5: how to add a css classname to html table tag?

StandardNerd
1#
StandardNerd Published in 2017-09-14 09:11:01Z

I'd like to style a specific class of tables differently in transformed HTML via CSS.

For example in XML:

<table>
  <row role="label">
    <cell>
      Manuscrit Bodmer
    </cell>
    <cell>
      Manuscrit fr. 1457
    </cell>
  </row>
  <row>
    <cell>
      <lb/>D├ębut <supplied><locus from="1r">fol. 1</locus></supplied> :
    </cell>
    <cell>
      <note><lb/><supplied>fol. 6v&#7506;, ligne 15</supplied> :</note>
    </cell>
  </row>
</table>

In XSL:

<xsl:template match="tei:table[not(. = '')]">
    <xsl:param name="sprache"/>
    <xsl:element name="table">
        <xsl:apply-templates><xsl:with-param name="sprache" select="$sprache"/></xsl:apply-templates>
    </xsl:element>
</xsl:template>

To achieve that I'm thinking of applying a specific CSS class to that table eg. in generated HTML

<table class="comparison-table">

and style it in css. Is this possible? And how can I achieve that exactly?

--- Update Thanks to @zx485 I updated XML & XSL to:

<xsl:template match="tei:table[@rend='comparison-table']">
    <xsl:param name="sprache"/>
    <xsl:copy>
        <xsl:attribute name="class"><xsl:text>comparison-table</xsl:text></xsl:attribute>
        <xsl:apply-templates><xsl:with-param name="sprache" select="$sprache"/></xsl:apply-templates>
    </xsl:copy>
</xsl:template>

<xsl:template match="tei:table[not(. = '')]">
    <xsl:param name="sprache"/>
    <xsl:element name="table">
        <xsl:apply-templates><xsl:with-param name="sprache" select="$sprache"/></xsl:apply-templates>
    </xsl:element>
</xsl:template>

And in my XML:

<table rend="comparison-table">
    <row role="label">
        <cell>
            Manuscrit Bodmer
        </cell>
        <cell>
            Manuscrit fr. 1457
        </cell>
    </row>
  ....

But in the generated HTML file the tables don't have css classname "comparison-table".

=== Update 2: As @zx485 suggested in the discussion room I just had to change to

<xsl:template match="tei:table">
zx485
2#
zx485 Reply to 2017-09-14 09:23:37Z

Change your template to

<xsl:template match="tei:table[not(. = '')]">
    <xsl:param name="sprache"/>
    <xsl:copy>
      <xsl:attribute name="class"><xsl:text>comparison-table</xsl:text></xsl:attribute>
      <xsl:apply-templates><xsl:with-param name="sprache" select="$sprache"/></xsl:apply-templates>
    </xsl:copy>
</xsl:template>
StandardNerd
3#
StandardNerd Reply to 2017-09-14 12:47:55Z

I refactored zx485's solution with xsl:if, it's probably more readable and follows the DRY-principle:

<xsl:template match="tei:table">
  <xsl:param name="sprache"/>
  <xsl:element name="table">
    <xsl:if test="@rend='comparison-table'">
      <xsl:attribute
name="class"><xsl:text>comparison-table</xsl:text></xsl:attribute>
    </xsl:if>
    <xsl:apply-templates><xsl:with-param name="sprache"
select="$sprache"/></xsl:apply-templates>
  </xsl:element>
</xsl:template>
You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.303248 second(s) , Gzip On .

© 2016 Powered by cudou.com design MATCHINFO