修改表td宽度

时间:2014-04-22 13:19:06

标签: css xml xslt html-table

我使用XML和XSL。

我想使用XML构建一个表,并使用XSL修改宽度。 我的XML表格是:

<table>
<tr><th>1</th><th>2</th><th>3</th><th>4</th></tr>
<tbody>
<tr><td>.</td><td>.</td><td>.</td><td>.</td></tr>
<tr><td>.</td><td>.</td><td>.</td><td>.</td></tr>
<tbody>
</table>

所以,我会有4列。修改4列宽度的最佳方法是什么?

2 个答案:

答案 0 :(得分:0)

我个人认为这是一个相当奇怪的问题。为什么要使用xslt添加标记。

这是你正在生成的HTML,因此我假设你的gona以类似浏览器的方式显示结果。然后我会建议你用飞机旧的CSS进行演示。

要执行此操作,只需在表标记中添加一个类,然后将css添加到样式。

示例:

<table class="MyNewTable"> .... </table>

然后添加样式部分(内联或链接到单独的文件)

<style type="text/css"> .MyNewTable td {width: 50px;} </style>

答案 1 :(得分:0)

不确定为什么要在XSLT中执行此操作...但是这里你去了 - 详细编辑:

    <?xml version="1.0" encoding="UTF-8"?>
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

        <xsl:output method="html"/>

        <xsl:template match="/">
            <html>
                <head>
                    <title>Table example</title>
                    <style type="text/css">
                        table.outputTable { width : 100%; border : 1px solid green;}
                        table.outputTable  td { border-bottom : 1px solid gray; border-right : 1px solid gray;}
                        .oddRow {background-color : #CCCCFF;}
                        .evenRow {background-color : #FFCCCC;}
                        .col2 { width : 10% }
                        .col3 { width : 33% }
                    </style>
                </head>
                <body>
                    <xsl:apply-templates />
                </body>
            </html>

        </xsl:template>

        <xsl:template match="table">
            <xsl:element name="table">
                <xsl:attribute name="class">outputTable</xsl:attribute>
                <tbody>
                <xsl:apply-templates select="tbody/tr"/>
                </tbody>
            </xsl:element>
        </xsl:template>

     <xsl:template match="tr">
         <xsl:element name="tr">
             <xsl:attribute name="class">oddRow</xsl:attribute>
             <xsl:apply-templates />
         </xsl:element>
     </xsl:template>

       <xsl:template match="tr[position() mod 2 = 0]">
        <xsl:element name="tr">
            <xsl:attribute name="class">evenRow</xsl:attribute>
            <xsl:apply-templates />
        </xsl:element>
       </xsl:template>

        <xsl:template match="td">
            <xsl:element name="td">
                <xsl:attribute name="class">col<xsl:value-of select="position()"/></xsl:attribute>
                <xsl:value-of select="."/>
            </xsl:element>
        </xsl:template>

    </xsl:stylesheet>

希望有所帮助