1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
---
title: 'Avaluació: Estructurar les dades dels planeta'
slug: Learn/HTML/Tables/Structuring_planet_data
tags:
- Assessment
- Beginner
- CodingScripting
- HTML
- Learn
- Tables
translation_of: Learn/HTML/Tables/Structuring_planet_data
original_slug: Learn/HTML/Taules_HTML/Avaluació_Estructurar_les_dades_dels_planeta
---
<div>{{LearnSidebar}}</div>
<div>{{PreviousMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
<p class="summary">En la nostra avaluació de la taula, proporcionarem algunes dades sobre els planetes del nostre sistema solar, per obtenir una estructura en una taula HTML.</p>
<table class="learn-box standard-table">
<tbody>
<tr>
<th scope="row">Requisits Previs:</th>
<td>Abans de procedir a aquesta avaluació ja s'hauria d'haver treballat a través de tots els articles d'aquest mòdul.</td>
</tr>
<tr>
<th scope="row">Objectiu:</th>
<td>Posar a prova la comprensió de les taules HTML i funcions associades.</td>
</tr>
</tbody>
</table>
<h2 id="Punt_de_partida">Punt de partida</h2>
<p>Per obtenir aquesta avaluació començarem per fer còpies locals de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/blank-template.html">blank-template.html</a>, <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/minimal-table.css">minimal-table.css</a> i <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/planets-data.txt">planets-data.txt</a> en un nou directori a l'equip local.</p>
<div class="note">
<p><strong>Nota</strong>: Com a alternativa, es pot utilitzar un lloc com <a class="external external-icon" href="https://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> per fer l'avaluació. Es pot fer enganxant el codi HTML, CSS i JavaScript en un d'aquests editors en línia. Si l'editor en línia que s'utilitza no té panells separats de JavaScript/CSS, lliurament es poden posar en línia amb els elements <code><script></code>/<code><style></code> dins de la pàgina HTML.</p>
</div>
<h2 id="Resum_del_projecte">Resum del projecte</h2>
<p>Estem treballant en una escola; actualment els estudiants estan estudiant els planetes del nostre sistema solar, i volem proporcionar-los un conjunt fàcil de seguiment de dades per buscar dades i xifres sobre els planetes. Una taula de dades HTML seria ideal - cal prendre les dades en brut que tenim disponibles i convertir-les en una taula, seguint els passos a continuació.</p>
<p>La taula d'acabada ha de tenir aquest aspecte:</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/14609/assessment-table.png" style="display: block; margin: 0 auto;"></p>
<p>També es pot <a href="https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html">veure el exemple en viu aquí</a> (sense mirar el codi font - no enganyar!)</p>
<ul>
</ul>
<h2 id="Passos_per_completar"><span class="short_text" id="result_box" lang="ca"><span>Passos</span> <span>per completar</span></span></h2>
<p>Els següents passos descriuen el que s'ha de fer per completar la taula d'exemple. Totes les dades que es necessitan estan contingudes en l'arxiu <code>planets-data.txt</code>. Si hi ha problemes per visualitzar les dades, mirar l'exemple viu de dalt, o tractar de dibuixar un diagrama.</p>
<ol>
<li>Obrir la còpia <code>blank-template.html</code> i començar la taula per fora, donant-li un recipient exterior, una capçalera i un cos de taula. No cal un peu de taula per a aquest exemple.</li>
<li>Afegir el títol proporcionat a la taula.</li>
<li>Afegir una fila a la capçalera de la taula que contingui tots els encapçalats de columna.</li>
<li>Crear totes les files de contingut dins del cos de la taula, sense oblidar de fer tots els encapçalats de les files en encapçalats semàntics.</li>
<li>Assegureu-vos que tot el contingut s'insereix en les cel·les correctes - amb les dades en brut, cada fila de dades del planeta s'ha de mostrar al costat del seu planeta associat.</li>
<li>Afegir atributs per fer que les capçaleres de fila i columna estiguin inequívocament associades a les files, columnes o grups de files que actuen com capçaleres.</li>
<li>Afegir una vora negre al voltant de la columna que conté tots els encapçalats de fila dels noms del planetes</li>
</ol>
<h2 id="Consells_i_suggeriments"><span class="short_text" id="result_box" lang="ca"><span>Consells</span> <span>i</span> <span>suggeriments</span></span></h2>
<ul>
<li>La primera cel·la de la fila de capçalera ha d'estar en blanc, i abasta dues columnes.</li>
<li>Els títols de les files del grup (per exemple <em>Jovian planets</em> ) que se situen a l'esquerra dels encapçalats de les files dels noms dels planetes (per exemple, <em>Saturn</em> ) són una mica complicats de classificar - necessita està segur que cadascun abasti el nombre correcte de files i columnes.</li>
<li>Associar les capçaleres amb les seves files/columnes és molt més fàcil que al revés.</li>
</ul>
<h2 id="Avaluació">Avaluació</h2>
<p>Si esteu seguint aquesta avaluació com a part d'un curs organitzat, heu de ser capaços de donar al treball al vostre professor/tutor per avaluar-ho. Si és d'auto-aprenentatge, llavors es pot obtenir la guia d'avaluació facilment preguntan a la llista de correu <a href="https://lists.mozilla.org/listinfo/dev-mdc">dev-mdc</a> o al canal d'IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Proveu el primer exercici - no hi ha res a guanyar amb trampes!</p>
<p>{{PreviousMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</p>
|
