Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Saberuneko en 3 Junio 2013, 23:22 pm



Título: Atascado con XSL
Publicado por: Saberuneko en 3 Junio 2013, 23:22 pm
[Estoy corto de tiempo, tengo hasta el 10-Junio]
(Nos han mandado esto a última hora)...


Nuestro profesor nos ha mandado hacer un proyecto, en el que damos formato a los datos de un XML con XSL.

Para la maquetación nos ha dicho que no debemos usar tablas, sino utilizar CSS. Cosa todavía no había intentado...

¿Cómo aplico una hoja de estilo a un XSL?

He probado con ponerlo en el header, tal como se haría en HTML, pero me da errores.
Código:
Error de lectura XML: mal formado
Ubicación: .../clima.xsl
Número de línea 6, columna 13

Tal que así:

Código
  1. <head>
  2. <link rel=StyleSheet href="style.css" type="text/css">
  3. </head>

--

Este es el XML dado:
Código
  1. <?xml version="1.0" encoding="ISO-8859-15" ?>
  2. <?xml-stylesheet type="text/xsl" href="clima.xsl"?>
  3. <root id="33044" version="1.0" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="http://www.aemet.es/xsd/localidades.xsd">
  4. <origen>
  5. <productor>Agencia Estatal de Meteorología - AEMET. Gobierno de España</productor>
  6. <web>http://www.aemet.es</web>
  7. <enlace>http://www.aemet.es/es/eltiempo/prediccion/municipios?l=33044</enlace>
  8. <language>es</language>
  9. <copyright>&#38;#169; AEMET. Autorizado el uso de la información y su reproducción citando a AEMET como autora de la misma.</copyright>
  10. <nota_legal>http://www.aemet.es/es/nota_legal</nota_legal>
  11. </origen>
  12. <elaborado>2013-06-03T09:05:03</elaborado>
  13. <nombre>Oviedo</nombre>
  14. <provincia>Asturias</provincia>
  15. <prediccion>
  16. <dia fecha="2013-06-03">
  17. <prob_precipitacion periodo="00-12">0</prob_precipitacion>
  18. <prob_precipitacion periodo="12-24">0</prob_precipitacion>
  19. <prob_precipitacion periodo="00-06">0</prob_precipitacion>
  20. <prob_precipitacion periodo="06-12">0</prob_precipitacion>
  21. <prob_precipitacion periodo="12-18">0</prob_precipitacion>
  22. <prob_precipitacion periodo="18-24">0</prob_precipitacion>
  23. <cota_nieve_prov periodo="00-12"></cota_nieve_prov>
  24. <cota_nieve_prov periodo="12-24"></cota_nieve_prov>
  25. <cota_nieve_prov periodo="00-06"></cota_nieve_prov>
  26. <cota_nieve_prov periodo="06-12"></cota_nieve_prov>
  27. <cota_nieve_prov periodo="12-18"></cota_nieve_prov>
  28. <cota_nieve_prov periodo="18-24"></cota_nieve_prov>
  29. <estado_cielo periodo="00-12" descripcion="Poco nuboso">12</estado_cielo>
  30. <estado_cielo periodo="12-24" descripcion="Poco nuboso">12</estado_cielo>
  31. <estado_cielo periodo="00-06" descripcion="Despejado">11n</estado_cielo>
  32. <estado_cielo periodo="06-12" descripcion="Poco nuboso">12</estado_cielo>
  33. <estado_cielo periodo="12-18" descripcion="Poco nuboso">12</estado_cielo>
  34. <estado_cielo periodo="18-24" descripcion="Poco nuboso">12</estado_cielo>
  35. <viento periodo="00-12">
  36. <direccion>NE</direccion>
  37. <velocidad>20</velocidad>
  38. </viento>
  39. <viento periodo="12-24">
  40. <direccion>E</direccion>
  41. <velocidad>20</velocidad>
  42. </viento>
  43. <viento periodo="00-06">
  44. <direccion>C</direccion>
  45. <velocidad>0</velocidad>
  46. </viento>
  47. <viento periodo="06-12">
  48. <direccion>NE</direccion>
  49. <velocidad>20</velocidad>
  50. </viento>
  51. <viento periodo="12-18">
  52. <direccion>E</direccion>
  53. <velocidad>20</velocidad>
  54. </viento>
  55. <viento periodo="18-24">
  56. <direccion>E</direccion>
  57. <velocidad>5</velocidad>
  58. </viento>
  59. <racha_max periodo="00-12"></racha_max>
  60. <racha_max periodo="12-24">45</racha_max>
  61. <racha_max periodo="00-06"></racha_max>
  62. <racha_max periodo="06-12"></racha_max>
  63. <racha_max periodo="12-18">40</racha_max>
  64. <racha_max periodo="18-24"></racha_max>
  65. <temperatura>
  66. <maxima>18</maxima>
  67. <minima>8</minima>
  68. <dato hora="06">8</dato>
  69. <dato hora="12">16</dato>
  70. <dato hora="18">16</dato>
  71. <dato hora="24">11</dato>
  72. </temperatura>
  73. <sens_termica>
  74. <maxima>18</maxima>
  75. <minima>8</minima>
  76. <dato hora="06">8</dato>
  77. <dato hora="12">16</dato>
  78. <dato hora="18">16</dato>
  79. <dato hora="24">11</dato>
  80. </sens_termica>
  81. <humedad_relativa>
  82. <maxima>90</maxima>
  83. <minima>60</minima>
  84. <dato hora="06">80</dato>
  85. <dato hora="12">65</dato>
  86. <dato hora="18">60</dato>
  87. <dato hora="24">90</dato>
  88. </humedad_relativa>
  89. <uv_max>7</uv_max>
  90. </dia>
  91. <dia fecha="2013-06-04">
  92. <prob_precipitacion periodo="00-12">0</prob_precipitacion>
  93. <prob_precipitacion periodo="12-24">0</prob_precipitacion>
  94. <prob_precipitacion periodo="00-06">0</prob_precipitacion>
  95. <prob_precipitacion periodo="06-12">0</prob_precipitacion>
  96. <prob_precipitacion periodo="12-18">0</prob_precipitacion>
  97. <prob_precipitacion periodo="18-24">0</prob_precipitacion>
  98. <cota_nieve_prov periodo="00-12"></cota_nieve_prov>
  99. <cota_nieve_prov periodo="12-24"></cota_nieve_prov>
  100. <cota_nieve_prov periodo="00-06"></cota_nieve_prov>
  101. <cota_nieve_prov periodo="06-12"></cota_nieve_prov>
  102. <cota_nieve_prov periodo="12-18"></cota_nieve_prov>
  103. <cota_nieve_prov periodo="18-24"></cota_nieve_prov>
  104. <estado_cielo periodo="00-12" descripcion="Despejado">11</estado_cielo>
  105. <estado_cielo periodo="12-24" descripcion="Despejado">11</estado_cielo>
  106. <estado_cielo periodo="00-06" descripcion="Despejado">11n</estado_cielo>
  107. <estado_cielo periodo="06-12" descripcion="Despejado">11</estado_cielo>
  108. <estado_cielo periodo="12-18" descripcion="Despejado">11</estado_cielo>
  109. <estado_cielo periodo="18-24" descripcion="Despejado">11</estado_cielo>
  110. <viento periodo="00-12">
  111. <direccion>NE</direccion>
  112. <velocidad>15</velocidad>
  113. </viento>
  114. <viento periodo="12-24">
  115. <direccion>NE</direccion>
  116. <velocidad>15</velocidad>
  117. </viento>
  118. <viento periodo="00-06">
  119. <direccion>C</direccion>
  120. <velocidad>0</velocidad>
  121. </viento>
  122. <viento periodo="06-12">
  123. <direccion>NE</direccion>
  124. <velocidad>15</velocidad>
  125. </viento>
  126. <viento periodo="12-18">
  127. <direccion>NE</direccion>
  128. <velocidad>15</velocidad>
  129. </viento>
  130. <viento periodo="18-24">
  131. <direccion>C</direccion>
  132. <velocidad>0</velocidad>
  133. </viento>
  134. <racha_max periodo="00-12"></racha_max>
  135. <racha_max periodo="12-24"></racha_max>
  136. <racha_max periodo="00-06"></racha_max>
  137. <racha_max periodo="06-12"></racha_max>
  138. <racha_max periodo="12-18"></racha_max>
  139. <racha_max periodo="18-24"></racha_max>
  140. <temperatura>
  141. <maxima>19</maxima>
  142. <minima>9</minima>
  143. <dato hora="06">9</dato>
  144. <dato hora="12">18</dato>
  145. <dato hora="18">17</dato>
  146. <dato hora="24">13</dato>
  147. </temperatura>
  148. <sens_termica>
  149. <maxima>19</maxima>
  150. <minima>9</minima>
  151. <dato hora="06">9</dato>
  152. <dato hora="12">18</dato>
  153. <dato hora="18">17</dato>
  154. <dato hora="24">13</dato>
  155. </sens_termica>
  156. <humedad_relativa>
  157. <maxima>100</maxima>
  158. <minima>55</minima>
  159. <dato hora="06">100</dato>
  160. <dato hora="12">60</dato>
  161. <dato hora="18">55</dato>
  162. <dato hora="24">80</dato>
  163. </humedad_relativa>
  164. <uv_max>7</uv_max>
  165. </dia>
  166. <dia fecha="2013-06-05">
  167. <prob_precipitacion periodo="00-12">5</prob_precipitacion>
  168. <prob_precipitacion periodo="12-24">15</prob_precipitacion>
  169. <cota_nieve_prov periodo="00-12"></cota_nieve_prov>
  170. <cota_nieve_prov periodo="12-24"></cota_nieve_prov>
  171. <estado_cielo periodo="00-12" descripcion="Despejado">11</estado_cielo>
  172. <estado_cielo periodo="12-24" descripcion="Intervalos nubosos">13</estado_cielo>
  173. <viento periodo="00-12">
  174. <direccion>NE</direccion>
  175. <velocidad>15</velocidad>
  176. </viento>
  177. <viento periodo="12-24">
  178. <direccion>NE</direccion>
  179. <velocidad>15</velocidad>
  180. </viento>
  181. <racha_max periodo="00-12"></racha_max>
  182. <racha_max periodo="12-24"></racha_max>
  183. <temperatura>
  184. <maxima>21</maxima>
  185. <minima>11</minima>
  186. </temperatura>
  187. <sens_termica>
  188. <maxima>21</maxima>
  189. <minima>11</minima>
  190. </sens_termica>
  191. <humedad_relativa>
  192. <maxima>85</maxima>
  193. <minima>60</minima>
  194. </humedad_relativa>
  195. <uv_max>7</uv_max>
  196. </dia>
  197. <dia fecha="2013-06-06">
  198. <prob_precipitacion periodo="00-12">35</prob_precipitacion>
  199. <prob_precipitacion periodo="12-24">70</prob_precipitacion>
  200. <cota_nieve_prov periodo="00-12"></cota_nieve_prov>
  201. <cota_nieve_prov periodo="12-24">2400</cota_nieve_prov>
  202. <estado_cielo periodo="00-12" descripcion="Intervalos nubosos">13</estado_cielo>
  203. <estado_cielo periodo="12-24" descripcion="Muy nuboso con tormenta">53</estado_cielo>
  204. <viento periodo="00-12">
  205. <direccion>C</direccion>
  206. <velocidad>0</velocidad>
  207. </viento>
  208. <viento periodo="12-24">
  209. <direccion>NO</direccion>
  210. <velocidad>5</velocidad>
  211. </viento>
  212. <racha_max periodo="00-12"></racha_max>
  213. <racha_max periodo="12-24"></racha_max>
  214. <temperatura>
  215. <maxima>19</maxima>
  216. <minima>12</minima>
  217. </temperatura>
  218. <sens_termica>
  219. <maxima>19</maxima>
  220. <minima>12</minima>
  221. </sens_termica>
  222. <humedad_relativa>
  223. <maxima>90</maxima>
  224. <minima>55</minima>
  225. </humedad_relativa>
  226. <uv_max>7</uv_max>
  227. </dia>
  228. <dia fecha="2013-06-07">
  229. <prob_precipitacion>90</prob_precipitacion>
  230. <cota_nieve_prov>2200</cota_nieve_prov>
  231. <estado_cielo descripcion="Muy nuboso con tormenta">53</estado_cielo>
  232. <viento>
  233. <direccion>C</direccion>
  234. <velocidad>0</velocidad>
  235. </viento>
  236. <racha_max></racha_max>
  237. <temperatura>
  238. <maxima>16</maxima>
  239. <minima>10</minima>
  240. </temperatura>
  241. <sens_termica>
  242. <maxima>16</maxima>
  243. <minima>10</minima>
  244. </sens_termica>
  245. <humedad_relativa>
  246. <maxima>95</maxima>
  247. <minima>75</minima>
  248. </humedad_relativa>
  249. <uv_max>7</uv_max>
  250. </dia>
  251. <dia fecha="2013-06-08">
  252. <prob_precipitacion>95</prob_precipitacion>
  253. <cota_nieve_prov>2200</cota_nieve_prov>
  254. <estado_cielo descripcion="Muy nuboso con tormenta">53</estado_cielo>
  255. <viento>
  256. <direccion>NO</direccion>
  257. <velocidad>10</velocidad>
  258. </viento>
  259. <racha_max></racha_max>
  260. <temperatura>
  261. <maxima>15</maxima>
  262. <minima>9</minima>
  263. </temperatura>
  264. <sens_termica>
  265. <maxima>15</maxima>
  266. <minima>9</minima>
  267. </sens_termica>
  268. <humedad_relativa>
  269. <maxima>100</maxima>
  270. <minima>80</minima>
  271. </humedad_relativa>
  272. </dia>
  273. <dia fecha="2013-06-09">
  274. <prob_precipitacion>80</prob_precipitacion>
  275. <cota_nieve_prov>2500</cota_nieve_prov>
  276. <estado_cielo descripcion="Muy nuboso con tormenta">53</estado_cielo>
  277. <viento>
  278. <direccion>N</direccion>
  279. <velocidad>10</velocidad>
  280. </viento>
  281. <racha_max></racha_max>
  282. <temperatura>
  283. <maxima>16</maxima>
  284. <minima>9</minima>
  285. </temperatura>
  286. <sens_termica>
  287. <maxima>16</maxima>
  288. <minima>8</minima>
  289. </sens_termica>
  290. <humedad_relativa>
  291. <maxima>100</maxima>
  292. <minima>85</minima>
  293. </humedad_relativa>
  294. </dia>
  295. </prediccion>
  296. </root>

--

Antes de meter nada más intenté meter la hoja de estilo, pero no pude.
De momento sólo tengo esto, en lo que leo un dato para probar que enlazan XSL con XML, el dato aparece, pero en cuanto intento enchufar la hoja de estilo, casca todo...

Código
  1. <?xml version="1.0" encoding="ISO-8859-1"?>
  2. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  3. <xsl:template match="/">
  4. <html>
  5. <head>
  6. <link rel=StyleSheet href="style.css" type="text/css">
  7. </head>
  8. <body>
  9. <div class = "caja">
  10. <div class = "titulo">
  11. Prediccion Meteorologica para los proximos 3 dias
  12. </div>
  13. <div class = "cuadro">
  14. <div class = "texto">
  15. Localidad: <xsl:value-of select="root/nombre"/>
  16.  
  17. </div>
  18. </div>
  19. </div>
  20. </body>
  21. </html>
  22.  
  23. </xsl:template>
  24. </xsl:stylesheet>


Título: Re: CSS en XSL?
Publicado por: Saberuneko en 4 Junio 2013, 12:32 pm
Vale, pues se hace como lo tenía yo, sólo que tenía un error de escritura...

En vez de:
Código:
<link rel=StyleSheet href="style.css" type="text/css">
Era:
Código:
<link rel="stylesheet" type="text/css" href="style.css">


Título: Re: Atascado con XSL
Publicado por: Saberuneko en 4 Junio 2013, 13:35 pm
Vuelvo a tener un problema, estoy intentando acceder a los distintos datos por día. Pero no consigo sacar absolutamente nada por pantalla, mi código de momento es:

Código
  1. <?xml version="1.0" encoding="ISO-8859-1"?>
  2. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  3. <xsl:template match="/">
  4. <html>
  5. <head>
  6. <link rel="stylesheet" type="text/css" href="style.css" />
  7. </head>
  8. <body>
  9. <div class = "caja">
  10. <div class = "titulo">
  11. Prediccion Meteorologica para los proximos 3 dias
  12. </div>
  13. <div class = "cuadro">
  14. <div class = "texto">
  15. <table>
  16. <tr>
  17. <td>Localidad: <xsl:value-of select="root/nombre"/></td>
  18. </tr>
  19. <tr>
  20. <td>Provincia: <xsl:value-of select="root/provincia"/></td>
  21. </tr>
  22. </table>
  23. </div>
  24. </div>
  25. <div class = "cuadro">
  26. <div class = "texto">
  27. <table>
  28. <tr>
  29. <xsl:for-each select="root/prediccion/dia">
  30. <td><xsl:value-of select="root/prediccion/dia/@fecha"/></td>
  31. </xsl:for-each>
  32. </tr>
  33. </table>
  34. </div>
  35. </div>
  36. </div>
  37. </body>
  38. </html>
  39.  
  40. </xsl:template>
  41. </xsl:stylesheet>

No consigo sacar las fechas como elemento de la nueva tabla. ¿Qué hago mal? Llevo atascado seis horas a base de ensayo y error, porque la información que encuentro no me está ayudando...


Título: Re: Atascado con XSL
Publicado por: Saberuneko en 4 Junio 2013, 18:57 pm
Por alguna razón que escapa a mi entendimiento el xsl:for-each no estaba funcionando como debería.

Un arreglo chapucero me ha solucionado temporalmente el problema, y me cubre otra necesidad, ya que en vez de todos los registros del XML, estoy intentando llevarme los 3 primeros nada más.

Aquí el code:

Código
  1. <td><xsl:value-of select="root/prediccion/dia[position()=1]/@fecha"/></td>
  2. <td><xsl:value-of select="root/prediccion/dia[position()=2]/@fecha"/></td>
  3. <td><xsl:value-of select="root/prediccion/dia[position()=3]/@fecha"/></td>

Básicamente pasé de usar un for-each y he recogido las posiciones manualmente una a una.

Si alguien tiene una solución mejor, que me responda, que me estoy partiendo el cráneo para sacar esto adelante a tiempo.


Título: Re: Atascado con XSL
Publicado por: Saberuneko en 4 Junio 2013, 21:10 pm
Ya lo he terminado. Pasaré mi solución cuando termine el plazo de entrega.
(No estaría bien que me lo copiase gente antes de tiempo).


Título: Re: Atascado con XSL
Publicado por: Saberuneko en 13 Junio 2013, 20:07 pm
Bueno, comparto mi solución final:
XSL:

Código
  1. <?xml version="1.0" encoding="ISO-8859-1"?>
  2. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  3. <xsl:template match="/">
  4. <html>
  5. <head>
  6. <link rel="stylesheet" type="text/css" href="style.css" />
  7. </head>
  8. <body>
  9. <div class = "caja">
  10. <div class = "titulo">
  11. Prediccion Meteorologica para los proximos 3 dias
  12. </div>
  13. <div class = "cuadro">
  14. <div class = "texto">
  15. <table>
  16. <tr>
  17. <td>Localidad: <xsl:value-of select="root/nombre"/></td>
  18. </tr>
  19. <tr>
  20. <td>Provincia: <xsl:value-of select="root/provincia"/></td>
  21. </tr>
  22. </table>
  23. </div>
  24. </div>
  25. <div class = "cuadro">
  26. <div class = "texto">
  27. <center><table>
  28. <tr>
  29. <td bgcolor ="#AAAAFF">Fecha:</td>
  30. <td colspan = "4" bgcolor ="#AAAAFF"><xsl:value-of select="root/prediccion/dia[position()=1]/@fecha"/></td>
  31. <td colspan = "4" bgcolor ="#AAAAFF"><xsl:value-of select="root/prediccion/dia[position()=2]/@fecha"/></td>
  32. <td colspan = "2" bgcolor ="#AAAAFF"><xsl:value-of select="root/prediccion/dia[position()=3]/@fecha"/></td>
  33. </tr>
  34. <tr>
  35. <td bgcolor ="#AAAAFF">Periodos:</td>
  36. <td bgcolor ="#AAAAFF">00-06</td><td bgcolor ="#AAAAFF">06-12</td><td bgcolor ="#AAAAFF">12-18</td><td bgcolor ="#AAAAFF">18-24</td>
  37. <td bgcolor ="#AAAAFF">00-06</td><td bgcolor ="#AAAAFF">06-12</td><td bgcolor ="#AAAAFF">12-18</td><td bgcolor ="#AAAAFF">18-24</td>
  38. <td bgcolor ="#AAAAFF">00-12</td><td bgcolor ="#AAAAFF">12-24</td>
  39. </tr>
  40. <tr>
  41. <td bgcolor ="#AAAAFF">Estado Cielo:</td>
  42. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/estado_cielo[@periodo='00-06']/@descripcion"/></td>
  43. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/estado_cielo[@periodo='06-12']/@descripcion"/></td>
  44. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/estado_cielo[@periodo='12-18']/@descripcion"/></td>
  45. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/estado_cielo[@periodo='18-24']/@descripcion"/></td>
  46.  
  47. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/estado_cielo[@periodo='00-06']/@descripcion"/></td>
  48. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/estado_cielo[@periodo='06-12']/@descripcion"/></td>
  49. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/estado_cielo[@periodo='12-18']/@descripcion"/></td>
  50. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/estado_cielo[@periodo='18-24']/@descripcion"/></td>
  51.  
  52. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/estado_cielo[@periodo='00-12']/@descripcion"/></td>
  53. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/estado_cielo[@periodo='12-24']/@descripcion"/></td>
  54. </tr>
  55. <tr>
  56. <td bgcolor ="#AAAAFF">Prob. Precipitaciones:</td>
  57. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/prob_precipitacion[@periodo='00-06']"/></td>
  58. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/prob_precipitacion[@periodo='06-12']"/></td>
  59. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/prob_precipitacion[@periodo='12-18']"/></td>
  60. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/prob_precipitacion[@periodo='18-24']"/></td>
  61.  
  62. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/prob_precipitacion[@periodo='00-06']"/></td>
  63. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/prob_precipitacion[@periodo='06-12']"/></td>
  64. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/prob_precipitacion[@periodo='12-18']"/></td>
  65. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/prob_precipitacion[@periodo='18-24']"/></td>
  66.  
  67. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/prob_precipitacion[@periodo='00-12']"/></td>
  68. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/prob_precipitacion[@periodo='12-24']"/></td>
  69. </tr>
  70. <tr>
  71. <td bgcolor ="#AAAAFF">Temp. Min/Max:</td>
  72. <td bgcolor ="#9999FF"></td>
  73. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/temperatura/minima"/></td>
  74. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/temperatura/maxima"/></td>
  75. <td bgcolor ="#9999FF"></td>
  76.  
  77. <td bgcolor ="#9999FF"></td>
  78. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/temperatura/minima"/></td>
  79. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/temperatura/maxima"/></td>
  80. <td bgcolor ="#9999FF"></td>
  81.  
  82. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/temperatura/minima"/></td>
  83. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/temperatura/maxima"/></td>
  84. </tr>
  85. <tr>
  86. <td bgcolor ="#AAAAFF">Humedad Min/Max:</td>
  87. <td bgcolor ="#9999FF"></td>
  88. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/humedad_relativa/minima"/></td>
  89. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=1]/humedad_relativa/maxima"/></td>
  90. <td bgcolor ="#9999FF"></td>
  91.  
  92. <td bgcolor ="#9999FF"></td>
  93. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/humedad_relativa/minima"/></td>
  94. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=2]/humedad_relativa/maxima"/></td>
  95. <td bgcolor ="#9999FF"></td>
  96.  
  97. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/humedad_relativa/minima"/></td>
  98. <td bgcolor ="#FFFFFF"><xsl:value-of select="root/prediccion/dia[position()=3]/humedad_relativa/maxima"/></td>
  99. </tr>
  100. </table></center>
  101. </div>
  102. <div class="cpr">
  103. <center>Fuente: Agencia Estatal de Meteorología - AEMET. Gobierno de España</center>
  104. </div>
  105. </div>
  106. </div>
  107. </body>
  108. </html>
  109.  
  110. </xsl:template>
  111. </xsl:stylesheet>
CSS:

Código
  1. body{ background-color:#9999FF;
  2. font-family:"Microsoft Sans Serif";
  3. font-size:16px;
  4. float:none}
  5.  
  6. .caja{ background-color:#CCCCFF;
  7. border-color:#FFFFFF;
  8. border-style:double;
  9. border-width: 10px;
  10. float:none}
  11.  
  12. .cuadro{background-color:#3333FF;
  13. border-style:simple;
  14. border-width: 2px;
  15. border-color: #6666FF;
  16. float:none}
  17.  
  18. .titulo{background-color:#FFFFFF;
  19. border-style:double;
  20. border-width: 4px;
  21. border-color: #FFFFFF;
  22. text-align:center;
  23. font-size:24px;
  24. float:none}
  25.  
  26. .texto{ background-color:#CCCCFF;
  27. border-width: 1px;
  28. border-color:#FFFFFF;
  29. text-align:left}
  30.  
  31. .cpr{ font-size:12px;
  32. color:white}

Finalmente, tiene este aspecto:
(http://img41.imageshack.us/img41/1849/prev3.jpg)

PS: Por alguna razón la etiqueta code lo ha descolocado todo. No consigo arreglarlo.