XML和CSS是Web開發中最常用的兩種技術之一。XML是一種標記語言，用于在Web應用程序之間交換數據。而CSS則是一種樣式表語言，用于控制Web應用程序的外觀和布局。這兩種技術相互配合可以實現一個完整的Web應用程序。
<catalog>
<book id="bk001">
<author>J.K. Rowling</author>
<title>Harry Potter and the Philosopher's Stone</title>
<genre>Fantasy</genre>
<price>19.99</price>
</book>
<book id="bk002">
<author>Jane Austen</author>
<title>Pride and Prejudice</title>
<genre>Romance</genre>
<price>14.99</price>
</book>
</catalog>body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
}
h1 {
color: #333;
text-align: center;
}
table {
border-collapse: collapse;
margin: 0 auto;
}
th, td {
border: 1px solid #ccc;
padding: 10px;
}在上面的XML代碼中，我們定義了一個書目目錄，包含兩本書的作者、標題、流派和價格。而在CSS代碼中，我們定義了一些基本樣式，如背景色、字體和文本對齊方式，以及表格的邊框和內邊距。
為了將XML和CSS結合起來，我們可以使用XSLT（可擴展樣式表語言轉換），將XML轉換為HTML并使用CSS樣式表進行控制。
下面是一個簡單的XSLT示例，將上面的XML數據轉換為一個包含表格的HTML文檔：
<xsl:template match="/">
<html>
<head>
<title>Book Catalog</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<h1>Book Catalog</h1>
<table>
<tr>
<th>Author</th>
<th>Title</th>
<th>Genre</th>
<th>Price</th>
</tr>
<xsl:for-each select="catalog/book">
<tr>
<td><xsl:value-of select="author"/></td>
<td><xsl:value-of select="title"/></td>
<td><xsl:value-of select="genre"/></td>
<td><xsl:value-of select="price"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>在上面的XSLT代碼中，我們定義了一個模板，匹配根元素“/”（即整個XML文檔）。我們創建了一個包含樣式表和表格的HTML文檔，然后使用XSLT的for-each語句遍歷XML文檔中的“book”元素，并在表格中顯示其作者、標題、流派和價格。
XSLT的優勢在于它可以將XML文檔從原始的數據存儲格式轉換為HTML或其他可視化格式，且可以對XML數據進行排序、過濾、聚合等操作。而結合CSS，可以對生成的HTML文檔進行樣式控制，從而實現更豐富的Web應用程序。