2

さて、私は最初のXMLプロジェクトで問題を抱えていたので、皆さんに目を向けました。連絡先データを含むXMLファイルを使用して名簿を作成しようとしています。このファイルはXSLTで変換されます。XMLファイルとXSLTファイルはどちらも正しく機能しますが、CSSファイルをXSLTに実装して、Webサイトの他の部分と一致するようにページをフォーマットしようとすると、問題が発生します。CSSが実装されると、私のテーブルにはXSLTで指定された最初の行のみが表示され、停止します。以下に、私の3つのファイルのコードと、CSSファイルが含まれている応答を示します。

XML： 

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="contactdata.xsl"?>

<!DOCTYPE addressbook [
<!ELEMENT addressbook (contact)>
<!ELEMENT contact (fname,lname,mi,staddress,city,state,zip,phone,email,twitter)>
<!ELEMENT fname (#PCDATA)>
<!ELEMENT lname (#PCDATA)>
<!ELEMENT mi (#PCDATA)>
<!ELEMENT staddress (#PCDATA)>
<!ELEMENT city (#PCDATA)>
<!ELEMENT state (#PCDATA)>
<!ELEMENT zip (#PCDATA)>
<!ELEMENT phone (#PCDATA)>
<!ELEMENT email (#PCDATA)>
<!ELEMENT twitter (#PCDATA)>
]>
<addressbook>
<contact>
<fname>Peyton</fname>
<lname>Manning</lname>
<mi>Z</mi>
<staddress>123 Go Vols</staddress>
<city>Denver</city>
<state>CO</state>
<zip>12345</zip>
<phone>1-800-youwish</phone>
<email>pmanning@broncos.com</email>
<twitter>peyton_manning</twitter>
</contact>

<contact>
<fname>Eric</fname>
<lname>Berry</lname>
<mi>P</mi>
<staddress>123 Arrowhead Stadium</staddress>
<city>Kansas City</city>
<state>MO</state>
<zip>34567</zip>
<phone>816-213-4452</phone>
<email>eberry@chiefs.com</email>
<twitter>eric_berry</twitter>
</contact>
</addressbook>

XSLT： 

<?xml-stylesheet type="text/css" href="sitetemplate.css"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 <xsl:output omit-xml-declaration="yes" indent="yes"/>
 <xsl:strip-space elements="*"/>


 <xsl:template match="/*">
    <html>
        <body>
            <table>
                <tr>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Middle Initial</th>
                    <th>Street Address</th>
                    <th>City</th>
                    <th>State</th>
                    <th>Zip</th>
                    <th>Phone</th>
                    <th>Email</th>
                    <th>Twitter</th>
                </tr>
                <xsl:apply-templates/>
            </table>
        </body>
    </html>
 </xsl:template>

 <xsl:template match="contact">
  <tr><xsl:apply-templates/></tr>
 </xsl:template>

 <xsl:template match="contact/*">
  <td><xsl:value-of select="."/></td>
 </xsl:template>
</xsl:stylesheet>

CSS： 

.text {font-family: Helvetica, Times, serif; color:white;}

.center {text-align:center;}

body {background-image:url('wallpaper.jpg'); font-family: Helvetica, Times, serif;}

hr {border: 0; width: 50%; color:white;}

table, th, td {border:10px white; background-color:blue; color:white;} 


a:link {color:#75B8FA; text-decoration:none;}
a:visited {color:#75B8FA; text-decoration:none;}
a:hover {color:#75B8FA; text-decoration:none;}
a:active {color:#FFFFFF; text-decoration:none;}

そして、実行しようとしたときにブラウザに表示されるもの：http: //i144.photobucket.com/albums/r171/jmock89/giventable.png （申し訳ありませんが、外部リンクです。10になるまでStackOverflowに画像を投稿できません。担当者）

4

1 に答える 1

1

CSSスタイルシートが次の場所にある場合： http://myUrl.com/myCSS.css 変換の直後に次のものを含めます<html>：

        <head>
          <link rel="stylesheet"
                type="text/css"
                href="http://myUrl.com/myCSS.css"/>
        </head>

または、スタイルをインラインで生成します。

        <head>
          <style>
                    .text {font-family: Helvetica, Times, serif; color:white;}

                    .center {text-align:center;}

                    body {background-image:url('wallpaper.jpg'); font-family: Helvetica, Times, serif;}

                    hr {border: 0; width: 50%; color:white;}

                    table, th, td {border:10px white; background-color:blue; color:white;}


                    a:link {color:#75B8FA; text-decoration:none;}
                    a:visited {color:#75B8FA; text-decoration:none;}
                    a:hover {color:#75B8FA; text-decoration:none;}
                    a:active {color:#FFFFFF; text-decoration:none;}
          </style>
        </head>

さらに別の選択肢：

必要な処理命令を生成します。

<?xml-stylesheet type="text/css" href="sitetemplate.css"?>

これを行うには、これを追加します（直前<html>）：

 <xsl:processing-instruction
 name="xml-stylesheet">type="text/css" href="sitetemplate.css"</xsl:processing-instruction>
于 2012-09-16T18:41:39.257 に答える