1 |
|
2 |
|
3 |
|
4 |
HTML Tables 7th July 1995 |
5 |
|
6 |
INTERNET DRAFT Dave Raggett, W3C |
7 |
Expires in six months email: <dsr@w3.org> |
8 |
|
9 |
HTML Tables |
10 |
|
11 |
<draft-ietf-html-tables-00.txt> |
12 |
|
13 |
Status of this Memo |
14 |
|
15 |
This document is an Internet draft. Internet drafts are working |
16 |
documents of the Internet Engineering Task Force (IETF), its areas |
17 |
and its working groups. Note that other groups may also distribute |
18 |
working information as Internet drafts. |
19 |
|
20 |
Internet Drafts are draft documents valid for a maximum of six |
21 |
months and can be updated, replaced or obsoleted by other documents |
22 |
at any time. It is inappropriate to use Internet drafts as reference |
23 |
material or to cite them as other than as "work in progress". |
24 |
|
25 |
To learn the current status of any Internet draft please check the |
26 |
"lid-abstracts.txt" listing contained in the Internet drafts shadow |
27 |
directories on ftp.is.co.za (Africa), nic.nordu.net (Europe), |
28 |
munnari.oz.au (Pacific Rim), ds.internic.net (US East coast) or |
29 |
ftp.isi.edu (US West coast). Further information about the IETF can |
30 |
be found at URL: http://www.cnri.reston.va.us/ |
31 |
|
32 |
Distribution of this document is unlimited. Please send comments to |
33 |
the HTML working group (HTML-WG) of the Internet Engineering Task |
34 |
Force (IETF) at <html-wg@wg.oclc.org>. Discussions of this group are |
35 |
archived at URL: http://www.acl.lanl.gov/HTML-WG/archives.html. |
36 |
|
37 |
Abstract |
38 |
|
39 |
The HyperText Markup Language (HTML) is a simple markup language |
40 |
used to create hypertext documents that are portable from one |
41 |
platform to another. HTML documents are SGML documents with generic |
42 |
semantics that are appropriate for representing information from a |
43 |
wide range of applications. This specification extends HTML to |
44 |
support a wide variety of tables. The model is designed to work well |
45 |
with associated style sheets, but does not require them. It also |
46 |
supports rendering to braille, or speech, and exchange of tabular |
47 |
data with databases and spreadsheets. The html table model embodies |
48 |
certain aspects of the CALS table model, e.g. the ability to group |
49 |
table rows into thead, tbody and tfoot sections, plus the ability to |
50 |
specify cell alignment compactly for groups of cells according to |
51 |
the context. |
52 |
|
53 |
Note that this is a preliminary draft, produced at short notice for |
54 |
discussion at the Stockholm IETF meeting of the HTML working group. |
55 |
A more detailed revision will be produced as soon as practical to |
56 |
fill in any gaps. |
57 |
|
58 |
|
59 |
|
60 |
Dave Raggett Page 1 |
61 |
|
62 |
|
63 |
|
64 |
HTML Tables 7th July 1995 |
65 |
|
66 |
Introduction |
67 |
|
68 |
This document sets out a revised proposal for the HTML table model, |
69 |
following discussions at the Danvers IETF meeting and discussions |
70 |
over email. The proposal is backwards compatible with the HTML+ |
71 |
specification and the implementation in the Netscape 1.1 browser. |
72 |
The HTML 3.0 specification is currently being rewritten to take into |
73 |
account recent discussions, and will incorporate the new table model |
74 |
in the next revision to the HTML 3.0 Internet Draft. The proposal |
75 |
goes beyond the earlier model and folds in some of the features of |
76 |
the CALS table model. The proposal has been designed with a view to |
77 |
the effective use of associated style sheets for richer control over |
78 |
appearence. |
79 |
|
80 |
Design Influences |
81 |
|
82 |
The html table model has evolved from studies of existing SGML |
83 |
tables models, the treatment of tables in common word processing |
84 |
packages, and looking at a wide range of tabular layout in |
85 |
magazines, books and other paper-based documents. The model was |
86 |
chosen to allow simple tables to be expressed simply with extra |
87 |
complexity only when needed. This makes it practical to create the |
88 |
markup for html tables with everyday text editors and reduces the |
89 |
learning curve for getting started. This feature has been very |
90 |
important to the success of html to date. |
91 |
|
92 |
Increasingly people are using filters from other document formats or |
93 |
direct wysiwyg editors for html. It is important that the html table |
94 |
model fits well with these routes for authoring html. This effects |
95 |
how the representation handles cells which span multiple rows or |
96 |
columns, and how alignment and other presentation properties are |
97 |
associated with groups of cells. |
98 |
|
99 |
A major consideration for the html table model is that the fonts and |
100 |
window sizes etc. in use with browsers are not under the author's |
101 |
control. This makes it impractical to rely on column widths |
102 |
specified in terms of absolute units such as picas or pixels. |
103 |
Instead, tables are dynamically sized to match the current window |
104 |
size and fonts. Authors can provide guidance as to the relative |
105 |
widths of columns, but user agents are expected to ensure that |
106 |
columns are wide enouh to avoid clipping cell contents. |
107 |
|
108 |
This proposal extends the html table model to support dynamic |
109 |
display of table contents as the table data arrives from the net. |
110 |
This feature requires the author to specify the number of columns, |
111 |
and includes provision for control of table width and the relative |
112 |
widths of different columns. |
113 |
|
114 |
The Department of Defense's work on CALS has established a de facto |
115 |
standard for SGML table models. The html table model builds upon |
116 |
experience gained with CALS, whilst avoiding some of the complexity |
117 |
associated with a simple minded adoption of the CALS model. Both |
118 |
models share the row-major treatment of tables, i.e. treating tables |
119 |
|
120 |
Dave Raggett Page 2 |
121 |
|
122 |
|
123 |
|
124 |
HTML Tables 7th July 1995 |
125 |
|
126 |
as a sequence of rows, which in turn, consist of a sequence of |
127 |
cells. This has worked well in practice. An alternative would be to |
128 |
represent the table as a sequence of columns, which in turn, consist |
129 |
of a sequence of cells. Both this and hybrid techniques were |
130 |
considered early on as candidates for html. |
131 |
|
132 |
In CALS you can group table rows into head, body and foot sections. |
133 |
This is frequently used to repeat table head and foot rows when |
134 |
breaking tables across page boundaries. CALS further allows you to |
135 |
use repeated groups of head/body/foot sections. This is generally |
136 |
thought to be unnecessary, and can be avoided by using a separate |
137 |
table for each such group. This proposal allows authors to use the |
138 |
head, body and foot sections for html tables only when needed. |
139 |
|
140 |
There are many potential properties relating to the presentation |
141 |
style of table cells, for instance, the border width, margins, |
142 |
vertical and horizontal alignment within cells, foreground and |
143 |
background colors and textures. The html proposal uses the same |
144 |
alignment properties as CALS, but separates off the representation |
145 |
of vertical and horizontal alignment using a more flexible treatment |
146 |
than CALS. The html table model also simplifies the treatment of |
147 |
borders, as this can be better handled along with other rendering |
148 |
properties through associated style sheets. |
149 |
|
150 |
The html table model permits arbitrary nesting of tables, unlike |
151 |
CALS. The processing time and memory requirements for laying out |
152 |
tables are linear with the depth of nesting and the size of table |
153 |
contents. The widespread deployment of Netscape 1.1 has provided an |
154 |
effective test of the core model, robustly handling a very wide |
155 |
range of tables. |
156 |
|
157 |
For the visually impaired, html offers the possibility of setting to |
158 |
rights the damage caused by the adoption of windows based graphical |
159 |
user interfaces. The html table model includes attributes for |
160 |
labelling each cell, to support high quality text to speech |
161 |
conversion. The same attributes can also be used to support |
162 |
automated import and export of table data to databases or |
163 |
spreadsheets. |
164 |
|
165 |
|
166 |
|
167 |
|
168 |
|
169 |
|
170 |
|
171 |
|
172 |
|
173 |
|
174 |
|
175 |
|
176 |
|
177 |
|
178 |
|
179 |
|
180 |
Dave Raggett Page 3 |
181 |
|
182 |
|
183 |
|
184 |
HTML Tables 7th July 1995 |
185 |
|
186 |
An Introduction to HTML Tables |
187 |
|
188 |
Table start with an optional caption followed one or more rows. Each |
189 |
row is formed by one or more cells, which are differentiated into |
190 |
header and data cells. Cells can be merged across rows and columns, |
191 |
and include attributes assisting rendering to speech and braille, or |
192 |
for exporting table data into databases. The model provides little |
193 |
direct support for control over appearence, for example border |
194 |
styles and margins, as these can be handled via subclassing and |
195 |
associated style sheets. |
196 |
|
197 |
Tables can contain a wide range of content, such as headers, lists, |
198 |
paragraphs, forms, figures, preformatted text and even nested |
199 |
tables. When the table is flush left or right, subsequent elements |
200 |
will be flowed around the table if there is sufficient room. This |
201 |
behaviour is disabled when the noflow attribute is given or the |
202 |
table align attribute is center (the default), or justify. |
203 |
|
204 |
Example |
205 |
|
206 |
<TABLE BORDER=ALL> |
207 |
<CAPTION>A test table with merged cells</CAPTION> |
208 |
<TR><TH ROWSPAN=2><TH COLSPAN=2>Average |
209 |
<TH ROWSPAN=2>other<BR>category<TH>Misc |
210 |
<TR><TH>height<TH>weight |
211 |
<TR><TH ALIGN=LEFT>males<TD>1.9<TD>0.003 |
212 |
<TR><TH ALIGN=LEFT ROWSPAN=2>females<TD>1.7<TD>0.002 |
213 |
</TABLE> |
214 |
|
215 |
This would be rendered something like: |
216 |
|
217 |
A test table with merged cells |
218 |
/--------------------------------------------------\ |
219 |
| | Average | other | Misc | |
220 |
| |-------------------| category |--------| |
221 |
| | height | weight | | | |
222 |
|-----------------------------------------|--------| |
223 |
| males | 1.9 | 0.003 | | | |
224 |
|-----------------------------------------|--------| |
225 |
| females | 1.7 | 0.002 | | | |
226 |
\--------------------------------------------------/ |
227 |
|
228 |
|
229 |
There are several points to note: |
230 |
|
231 |
* By default, header cells are centered while data cells are flush |
232 |
left. This can be overriden by the ALIGN attribute for the cell |
233 |
or a matching HSPEC element. |
234 |
|
235 |
* Cells may be empty. |
236 |
|
237 |
* Cells spanning rows contribute to the column count on each of |
238 |
the spanned rows, but only appear in the markup once (in the |
239 |
|
240 |
Dave Raggett Page 4 |
241 |
|
242 |
|
243 |
|
244 |
HTML Tables 7th July 1995 |
245 |
|
246 |
first row spanned). |
247 |
|
248 |
* If the column count for the table is greater than the number of |
249 |
cells for a given row (after including cells for spanned rows), |
250 |
the missing cells are treated as occurring on the right handside |
251 |
of the table, and rendered as empty cells. |
252 |
|
253 |
* The row count is determined by the TR elements - any rows |
254 |
implied by cells spanning rows beyond this should be ignored. |
255 |
|
256 |
* The user agent should be able to recover from a missing <TR> tag |
257 |
prior to the first row as the TH and TD elements can only occur |
258 |
within the TR element. |
259 |
|
260 |
* It is invalid to have cells overlap, see below for an example. |
261 |
In such cases, the rendering is implementation dependent. |
262 |
|
263 |
An example of an invalid table: |
264 |
|
265 |
<table border=all> |
266 |
<tr><tdrowspan=2>1<td>2<td>3<td>4<td>5 |
267 |
<tr><td rowspan=2>6 |
268 |
<tr><td colspan=2>7<td>8 |
269 |
</table> |
270 |
|
271 |
which looks something like: |
272 |
|
273 |
/-------------------\ |
274 |
| 1 | 2 | 3 | 4 | 5 | |
275 |
| |---------------| |
276 |
| | 6 | | | | The cells labelled 6 and 7 overlap! |
277 |
|---|...|-----------| |
278 |
| 7 : | 8 | | | |
279 |
\-------------------/ |
280 |
|
281 |
|
282 |
|
283 |
|
284 |
|
285 |
|
286 |
|
287 |
|
288 |
|
289 |
|
290 |
|
291 |
|
292 |
|
293 |
|
294 |
|
295 |
|
296 |
|
297 |
|
298 |
|
299 |
|
300 |
Dave Raggett Page 5 |
301 |
|
302 |
|
303 |
|
304 |
HTML Tables 7th July 1995 |
305 |
|
306 |
Some more features |
307 |
|
308 |
The next few sections introduce some more features of the html table |
309 |
model, leaving the advanced features to later on. |
310 |
|
311 |
Table Captions |
312 |
|
313 |
The CAPTION element can be used to define a table caption, and if |
314 |
present, must occur immediately following the TABLE start tag. You |
315 |
can specify the position of the caption relative to the table with |
316 |
the ALIGN attribute, e.g. |
317 |
|
318 |
<CAPTION ALIGN=BOTTOM>the table caption</CAPTION> |
319 |
|
320 |
The ALIGN attribute can take the values: TOP, BOTTOM, LEFT or RIGHT. |
321 |
The attribute value is case insensitive. Note that the end tag is |
322 |
optional. |
323 |
|
324 |
Head, Body and Foot table sections |
325 |
|
326 |
The THEAD, TBODY and TFOOT elements can be used to group table rows |
327 |
into corresponding head, body and foot sections. This gives user |
328 |
agents a better handle on rendering long tables, e.g. if the table |
329 |
has a large number of rows in the body section, the user agent could |
330 |
use a scrolling region to render the table compactly. When rendering |
331 |
to a paged output device tables will often have to be broken across |
332 |
page boundaries. The thead, tbody and tfoot elements allow the user |
333 |
agent to repeat the table foot at the bottom of the current page and |
334 |
the table head at the top of the new page before continuing on, |
335 |
where left off, with the body section. |
336 |
|
337 |
Another motivation for using thead, tbody and tfoot elements is the |
338 |
ability they give authors to more easily control the border style |
339 |
and the horizontal and vertical alignment of cell contents. |
340 |
|
341 |
|
342 |
<TABLE BORDER=FEW> |
343 |
<CAPTION>A test table with merged cells</CAPTION> |
344 |
<THEAD> |
345 |
<TR><TH ROWSPAN=2><TH COLSPAN=2>Average |
346 |
<TH ROWSPAN=2>other<BR>category<TH>Misc |
347 |
<TBODY> |
348 |
<TR><TH>height<TH>weight |
349 |
<TR><TH ALIGN=LEFT>males<TD>1.9<TD>0.003 |
350 |
<TR><TH ALIGN=LEFT ROWSPAN=2>females<TD>1.7<TD>0.002 |
351 |
</TABLE> |
352 |
|
353 |
|
354 |
Note: the end tags for THEAD, TBODY and TFOOT can always be omitted, |
355 |
but if you have a THEAD, then you will need to include a TBODY start |
356 |
tag too. Otherwise, the parser won't be able to distinguish body |
357 |
rows from head rows. |
358 |
|
359 |
|
360 |
Dave Raggett Page 6 |
361 |
|
362 |
|
363 |
|
364 |
HTML Tables 7th July 1995 |
365 |
|
366 |
Border Styles |
367 |
|
368 |
The BORDER attribute on the TABLE element can be used to select |
369 |
which borders are drawn from several common categories. More |
370 |
detailed control may be obtained by using an associated style sheet. |
371 |
The default behaviour is to render the table without borders. |
372 |
|
373 |
border=none |
374 |
suppress borders - useful with graphics etc. |
375 |
|
376 |
border=frame |
377 |
outer border around table only |
378 |
|
379 |
border=basic |
380 |
horizontal border between THEAD and TBODY, and between TBODY and |
381 |
TFOOT |
382 |
|
383 |
border=rows |
384 |
like border=basic with an outer border, plus horizontal borders |
385 |
between rows |
386 |
|
387 |
border=cols |
388 |
like border=basic with an outer border, plus vertical borders |
389 |
between columns |
390 |
|
391 |
border=all |
392 |
borders around all cells, including an outer border |
393 |
|
394 |
Borderless tables are useful for layout purposes as well as their |
395 |
traditional role for tabular data, for instance with fill-out forms: |
396 |
|
397 |
name: [John Smith ] |
398 |
card number: [4619 693523 20851 ] |
399 |
expires: [03] / [97] |
400 |
telephone: [212 873 2739 ] |
401 |
|
402 |
This can be represented as a table with one row and two columns. The |
403 |
first column is right aligned, while the second is left aligned. |
404 |
This example could be marked up as: |
405 |
|
406 |
<table border=none> |
407 |
<tr> |
408 |
<td align=right> |
409 |
name:<br> |
410 |
card number:<br> |
411 |
expires:<br> |
412 |
telephone: |
413 |
<td align=left> |
414 |
<input name="name" size=18><br> |
415 |
<input name="cardnum" size=18><br> |
416 |
<input name="expires-month" size=2> / |
417 |
<input name="expires-year" size=2><br> |
418 |
<input name="phone" size=18><br> |
419 |
|
420 |
Dave Raggett Page 7 |
421 |
|
422 |
|
423 |
|
424 |
HTML Tables 7th July 1995 |
425 |
|
426 |
</table> |
427 |
|
428 |
|
429 |
The use of such techniques is one of the motivations for using |
430 |
nested tables, where borderless tables are used to layout cell |
431 |
contents for an enclosing table |
432 |
|
433 |
Table Layout Options |
434 |
|
435 |
Normally, tables are rendered in a two stage process. The first |
436 |
stage determines suitable column widths based on cell content, while |
437 |
the second stage actually renders the table using these widths. For |
438 |
large tables or slow network connections, you can give the user |
439 |
agent a chance to start displaying the table incrementally as the |
440 |
data arrives from the network. To do this use the COLS attribute on |
441 |
the TABLE element to specify the number of columns, e.g. <table |
442 |
border=all cols=5>. |
443 |
|
444 |
For the incremental display mode, the default table width is the |
445 |
current window size (the space between the left and right margins). |
446 |
You can set the table width relative to this default using the WIDTH |
447 |
attribute e.g. width="50%". By default, With the incremental display |
448 |
mode all columns have the same width. Note that the WIDTH attribute |
449 |
takes the form of a positive integer followed by a percent sign. |
450 |
|
451 |
You can specify the relative widths of some or all of the columns |
452 |
using the COLW element, e.g. <colw col=3 width=2.5>. This example |
453 |
specifies a relative width of two and a half for column 3. The |
454 |
default relative width is 1.0. Note that the incremental mode may |
455 |
result in columns that are too small in some cases. The user agent |
456 |
can then choose to redraw the table with more appropriate column |
457 |
widths once all of the table data has been received. |
458 |
|
459 |
Both the COL and the WIDTH attributes are required for the COLW |
460 |
element. The WIDTH attribute takes the form of a positive number and |
461 |
may include a decimal point for floating point values. The COL |
462 |
attribute is a positive integer value. COL=1 denotes the first |
463 |
column, with COL=2 for the second column and so on, where columns |
464 |
are numbered from left to right. Simple column ranges are also |
465 |
permitted, e.g. COL=3-7 which matches columns 3, 4, 5, 6 and 7. The |
466 |
range is limited to the form lower-upper, when both values are |
467 |
positive integer values separated by a hyphen, and upper should be |
468 |
greater than lower. |
469 |
|
470 |
An example for an incremental mode table with 4 columns: |
471 |
|
472 |
<table borders=all cols=4 width="80%"> |
473 |
<colw col=1 width=4> |
474 |
<colw col=2 width=1.5> |
475 |
<colw col=3 width=1.5> |
476 |
<colw col=4 width=3> |
477 |
<tr> -- table data follows -- |
478 |
</table> |
479 |
|
480 |
Dave Raggett Page 8 |
481 |
|
482 |
|
483 |
|
484 |
HTML Tables 7th July 1995 |
485 |
|
486 |
|
487 |
You can also specify relative widths for the auto layout mode. The |
488 |
same goes for the table width attribute. The sizing algorithm does |
489 |
its best to meet your suggestions, but ensures that all the columns |
490 |
are large enough for the cell contents. Further details on the |
491 |
algorithm are given in a later section. |
492 |
|
493 |
|
494 |
|
495 |
|
496 |
|
497 |
|
498 |
|
499 |
|
500 |
|
501 |
|
502 |
|
503 |
|
504 |
|
505 |
|
506 |
|
507 |
|
508 |
|
509 |
|
510 |
|
511 |
|
512 |
|
513 |
|
514 |
|
515 |
|
516 |
|
517 |
|
518 |
|
519 |
|
520 |
|
521 |
|
522 |
|
523 |
|
524 |
|
525 |
|
526 |
|
527 |
|
528 |
|
529 |
|
530 |
|
531 |
|
532 |
|
533 |
|
534 |
|
535 |
|
536 |
|
537 |
|
538 |
|
539 |
|
540 |
Dave Raggett Page 9 |
541 |
|
542 |
|
543 |
|
544 |
HTML Tables 7th July 1995 |
545 |
|
546 |
Horizontal Alignment of Cell Contents |
547 |
|
548 |
By default, data cells (TD) are left aligned while header cells (TH) |
549 |
are centered. You can override the default alignment with the ALIGN |
550 |
attribute on the table cell, e.g. <td align=right>. There are |
551 |
several attributes assoociated with horizontal alignment: |
552 |
|
553 |
ALIGN |
554 |
This can be one of: LEFT, CENTER, RIGHT, JUSTIFY and CHAR. User |
555 |
agents may treat Justify as left alignment if they lack support |
556 |
for text justification. ALIGN=CHAR is used for aligning cell |
557 |
contents on a particular character. The attribute value for |
558 |
ALIGN is case insensitive. |
559 |
|
560 |
CHAR |
561 |
This is used to specify an alignment character for use with |
562 |
align=char, e.g. char=":". The default character is "." |
563 |
|
564 |
CHAROFF |
565 |
This is used with align=char to specify the relative offset of |
566 |
the alignment character with respect to the width of the cell. |
567 |
The attribute value takes the form of a positive integer in the |
568 |
range 1 to 100 followed by a percent sign, e.g. charoff="50%". |
569 |
|
570 |
The earlier example of aligning form fields can be more simply |
571 |
achieved using align on char and using the CHAR attribute to set the |
572 |
alignment character to a convenient character, for example: |
573 |
|
574 |
<table> |
575 |
<tr> |
576 |
<td align=char char=":"> |
577 |
name: <input name="name" size=18><br> |
578 |
card number: <input name="cardnum" size=18><br> |
579 |
expires: <input name="expires-month" size=2> / |
580 |
<input name="expires-year" size=2><br> |
581 |
telephone:<input name="phone" size=18><br> |
582 |
</table> |
583 |
|
584 |
|
585 |
Each line in the table is then indented so that all the colons are |
586 |
positioned under one another. |
587 |
|
588 |
Vertical Alignment of Cell Contents |
589 |
|
590 |
By default, cell contents are vertically aligned at the middle of |
591 |
each cell. The VALIGN attribute can be used with TH or TD to |
592 |
override this default. It can take one of the following values: TOP, |
593 |
MIDDLE or BOTTOM, e.g. <TD VALIGN=TOP>. Note that the attribute |
594 |
value is case insensitive. |
595 |
|
596 |
Note: the ability to ensure several cells on the same row share the |
597 |
same baseline has been left out of this specification owing to |
598 |
difficulties in providing a adequate definition of this feature. |
599 |
|
600 |
Dave Raggett Page 10 |
601 |
|
602 |
|
603 |
|
604 |
HTML Tables 7th July 1995 |
605 |
|
606 |
|
607 |
More advanced ways of specifying alignment |
608 |
|
609 |
If there are lots of cells, it rapidly becomes tedious and |
610 |
inefficient to explicitly specify the horizontal and vertical |
611 |
alignment attributes on each cell. A more compact alternative is to |
612 |
use the HSPEC and VSPEC elements to specify alignment properties for |
613 |
groups of matching cells. |
614 |
|
615 |
HSPEC and VSPEC elements specify alignment properties for table |
616 |
cells and act like IF-THEN rules. The IF part is a conjunction of |
617 |
the following optional parts: |
618 |
|
619 |
1. whether the cell is in thead, tbody or tfoot (rowgroup) |
620 |
|
621 |
2. the class attribute of the current row (rowclass) |
622 |
|
623 |
3. whether the cell is a header or data cell (celltype) |
624 |
|
625 |
4. the class attribute of the cell itself (cellclass) |
626 |
|
627 |
5. the cell's row and/or column number (row or col) |
628 |
|
629 |
If the cell straddles two or more rows or columns, the number of the |
630 |
first row/column is used for evaluating the match. |
631 |
|
632 |
The THEN part sets the horizontal or vertical alignment for the |
633 |
cell's contents. The class attribute of the hspec or tspec element |
634 |
matching a cell can also be used by style sheets to attach |
635 |
additional rending properties to groups of cells. |
636 |
|
637 |
Conflict resolution is real simple: |
638 |
|
639 |
1. properties defined as attributes on cells always override hspec |
640 |
or vspec |
641 |
|
642 |
2. hspec and vspec are lexically ordered from general to specific, |
643 |
i.e. the last matching hspec or vspec elements sets the cell's |
644 |
alignment properties |
645 |
|
646 |
Some simple examples: |
647 |
|
648 |
|
649 |
<hspec celltype=th col=1 align=center> |
650 |
<hspec celltype=td col=1 align=left> |
651 |
|
652 |
|
653 |
This example sets different alignments for cells in column 1 |
654 |
depending on whether they are header or data cells. When several |
655 |
HSPEC elements match a given cell, the last one wins. Note that an |
656 |
explicit ALIGN attribute set on the cell itself always wins over any |
657 |
HSPEC elements. |
658 |
|
659 |
|
660 |
Dave Raggett Page 11 |
661 |
|
662 |
|
663 |
|
664 |
HTML Tables 7th July 1995 |
665 |
|
666 |
|
667 |
<vspec rowgroup=thead row=1-3 valign=bottom> |
668 |
<vspec rowgroup=tbody row=1-3 align=top> |
669 |
|
670 |
|
671 |
This example sets different alignments for cells in rows 1 to 3 |
672 |
depending on whether they are in the THEAD or in the TBODY. When |
673 |
several VSPEC elements match a given cell, the last one wins. Note |
674 |
that an explicit VALIGN attribute set on the cell itself always wins |
675 |
over any VSPEC elements. |
676 |
|
677 |
|
678 |
|
679 |
|
680 |
|
681 |
|
682 |
|
683 |
|
684 |
|
685 |
|
686 |
|
687 |
|
688 |
|
689 |
|
690 |
|
691 |
|
692 |
|
693 |
|
694 |
|
695 |
|
696 |
|
697 |
|
698 |
|
699 |
|
700 |
|
701 |
|
702 |
|
703 |
|
704 |
|
705 |
|
706 |
|
707 |
|
708 |
|
709 |
|
710 |
|
711 |
|
712 |
|
713 |
|
714 |
|
715 |
|
716 |
|
717 |
|
718 |
|
719 |
|
720 |
Dave Raggett Page 12 |
721 |
|
722 |
|
723 |
|
724 |
HTML Tables 7th July 1995 |
725 |
|
726 |
Autolayout Table Sizing Algorithm |
727 |
|
728 |
The layout algorithm for the incremental display mode has already |
729 |
been presented in a previous section. If the COLS attribute is |
730 |
missing from the table start tag, then the user agent should use the |
731 |
autolayout sizing algorithm, which uses two passes through the table |
732 |
data. |
733 |
|
734 |
In the first pass, word wrapping is disabled, and the user agent |
735 |
keeps track of the minimum and maximum width of each cell. The |
736 |
maximum width is given by the widest line. As word wrap has been |
737 |
disabled, paragraphs are treated as long lines unless broken by <BR> |
738 |
elements. The minimum width is given by the widest word or image |
739 |
etc. taking into account leading indents and list bullets etc. In |
740 |
other words, if you were to format the cell's content in a window of |
741 |
its own, determine the minimum width you could make the window |
742 |
before things begin to be clipped. |
743 |
|
744 |
The minimum and maximum cell widths are then used to determine the |
745 |
corresponding minimum and maximum widths for the columns. These in |
746 |
turn, are used to find the minimum and maximum width for the table. |
747 |
Note that cells can contain nested tables, but this doesn't |
748 |
complicate the code significantly. The next step is to assign column |
749 |
widths according to the current window size (more accurately - the |
750 |
width between the left and right margins). |
751 |
|
752 |
The table borders and intercell margins need to be included in the |
753 |
assignment step. There are three cases: |
754 |
|
755 |
1. The minimum table width is equal to or wider than the available |
756 |
space. In this case, assign the minimum widths and allow the |
757 |
user to scroll horizontally. For conversion to braille, it will |
758 |
be necessary to replace the cells by references to notes |
759 |
containing their full content. By convention these appear before |
760 |
the table. |
761 |
|
762 |
2. The maximum table width fits within the available space. In this |
763 |
case, set the columns to their maximum widths. |
764 |
|
765 |
3. The maximum width of the table is greater than the available |
766 |
space, but the minimum table width is smaller. In this case, |
767 |
find the difference between the available space and the minimum |
768 |
table width, lets call it W. Lets also call D the difference |
769 |
between maximum and minimum width of the table. |
770 |
|
771 |
For each column, let d be the the difference between maximum and |
772 |
minimum width of that column. Now set the column's width to the |
773 |
minimum width plus d times W over D. This makes columns with |
774 |
lots of text wider than columns with smaller amounts. |
775 |
|
776 |
This assignment step is then repeated for nested tables. In this |
777 |
case, the width of the enclosing table's cell plays the role of the |
778 |
current window size in the above description. This process is |
779 |
|
780 |
Dave Raggett Page 13 |
781 |
|
782 |
|
783 |
|
784 |
HTML Tables 7th July 1995 |
785 |
|
786 |
repeated recursively for all nested tables. |
787 |
|
788 |
If the table width is specified with the WIDTH attribute, the user |
789 |
agent attempts to set column widths to match. The WIDTH attribute |
790 |
should be disregarded if this results in columns having less than |
791 |
their minimum widths. |
792 |
|
793 |
If relative widths are specified with the COLW element, the |
794 |
algorithm is modified to increase column widths over the minimum |
795 |
width to meet the relative width constraints. |
796 |
|
797 |
|
798 |
|
799 |
|
800 |
|
801 |
|
802 |
|
803 |
|
804 |
|
805 |
|
806 |
|
807 |
|
808 |
|
809 |
|
810 |
|
811 |
|
812 |
|
813 |
|
814 |
|
815 |
|
816 |
|
817 |
|
818 |
|
819 |
|
820 |
|
821 |
|
822 |
|
823 |
|
824 |
|
825 |
|
826 |
|
827 |
|
828 |
|
829 |
|
830 |
|
831 |
|
832 |
|
833 |
|
834 |
|
835 |
|
836 |
|
837 |
|
838 |
|
839 |
|
840 |
Dave Raggett Page 14 |
841 |
|
842 |
|
843 |
|
844 |
HTML Tables 7th July 1995 |
845 |
|
846 |
HTML Table DTD |
847 |
|
848 |
The DTD or document type definition provides a formal definition of |
849 |
the allowed syntax for html tables. |
850 |
|
851 |
|
852 |
<!-- The HTML Table DTD --> |
853 |
|
854 |
<!-- border styles (overridden by style sheets) |
855 |
|
856 |
none suppress borders - useful with graphics etc. |
857 |
frame outer border around table only |
858 |
basic border between thead/tbody and tbody/tfoot |
859 |
rows as per basic plus frame plus row separators |
860 |
cols as per basic plus frame plus column separators |
861 |
all draw borders around all cells |
862 |
--> |
863 |
|
864 |
<!ENTITY % border.styles |
865 |
"none | frame | basic | rows | cols | all"> |
866 |
|
867 |
<!-- horizontal alignment attributes for cell contents --> |
868 |
|
869 |
<!ENTITY % cell.halign |
870 |
"align (left|center|right|justify|char) #IMPLIED |
871 |
char CDATA #IMPLIED -- alignment char, e.g. align=':' -- |
872 |
charoff CDATA #IMPLIED -- offset of alignment char, eg charoff='50%' --" |
873 |
> |
874 |
|
875 |
<!-- vertical alignment attributes for cell contents --> |
876 |
|
877 |
<!ENTITY % cell.valign |
878 |
"valign (top|middle|bottom) #IMPLIED" |
879 |
> |
880 |
|
881 |
<!-- |
882 |
%body.content allows table cells to contain headers, paras, |
883 |
lists, form elements and even arbitrarily nested tables. |
884 |
|
885 |
%text is text characters, including character entities and |
886 |
character emphasis elements, IMG and anchors |
887 |
--> |
888 |
|
889 |
<!ELEMENT table - - (caption?, (colw|hspec|vspec)*, thead?, tbody, tfoot?)> |
890 |
<!ELEMENT caption - O (%text)+> |
891 |
<!ELEMENT colw - O EMPTY> |
892 |
<!ELEMENT hspec - O EMPTY> |
893 |
<!ELEMENT vspec - O EMPTY> |
894 |
<!ELEMENT thead - O tr+> |
895 |
<!ELEMENT tbody O O tr+> |
896 |
<!ELEMENT tfoot - O tr+> |
897 |
<!ELEMENT tr - O (th|td)+> |
898 |
<!ELEMENT (th|td) - O %body.content> |
899 |
|
900 |
Dave Raggett Page 15 |
901 |
|
902 |
|
903 |
|
904 |
HTML Tables 7th July 1995 |
905 |
|
906 |
|
907 |
<!ATTLIST table |
908 |
width CDATA #IMPLIED -- table width relative to window -- |
909 |
cols NUMBER #IMPLIED -- used for immediate display mode -- |
910 |
border (%border.styles) #IMPLIED -- see above definition -- |
911 |
nowrap (nowrap) #IMPLIED -- disable word wrap inside table -- |
912 |
> |
913 |
|
914 |
<!ATTLIST caption |
915 |
align (top|bottom) #IMPLIED -- relative to table -- |
916 |
> |
917 |
|
918 |
<!ATTLIST colw -- specifies relative column widths -- |
919 |
col CDATA #REQUIRED -- column number or range -- |
920 |
width CDATA #REQUIRED -- positive number, e.g. 2.5 -- |
921 |
> |
922 |
|
923 |
<!-- hspec and vspec elements specify alignment properties |
924 |
for table cells and act like IF-THEN rules. The IF part is |
925 |
a conjunction of the following optional parts: |
926 |
|
927 |
a) whether the cell is in thead, tbody or tfoot (rowgroup) |
928 |
b) the class attribute of the current row (rowclass) |
929 |
c) whether the cell is a header or data cell (celltype) |
930 |
d) the class attribute of the cell itself (cellclass) |
931 |
e) the cell's row and/or column number (row or col) |
932 |
|
933 |
If the cell straddles two or more rows or columns, the number |
934 |
of the first row/column is used for evaluating the match. |
935 |
|
936 |
The THEN part sets the horizontal or vertical alignment for |
937 |
the cell's contents. The class attribute of the hspec or tspec |
938 |
element matching a cell can also be used by style sheets to |
939 |
attach additional rending properties to groups of cells. |
940 |
|
941 |
Conflict resolution is real simple: |
942 |
|
943 |
a) properties defined as attributes on cells always |
944 |
override hspec or vspec |
945 |
|
946 |
b) hspec and vspec are lexically ordered from general |
947 |
to specific, i.e. the last matching hspec or vspec |
948 |
elements sets the cell's alignment properties |
949 |
--> |
950 |
|
951 |
<!ATTLIST hspec |
952 |
rowgroup (thead|tbody|tfoot) #IMPLIED -- enclosing row group -- |
953 |
rowclass CDATA #IMPLIED -- class of enclosing row -- |
954 |
celltype (th|td) #IMPLIED -- header, data or either -- |
955 |
cellclass CDATA #IMPLIED -- class of cell itself -- |
956 |
%cell.halign; -- implied horizontal alignment -- |
957 |
> |
958 |
|
959 |
|
960 |
Dave Raggett Page 16 |
961 |
|
962 |
|
963 |
|
964 |
HTML Tables 7th July 1995 |
965 |
|
966 |
<!ATTLIST vspec |
967 |
rowgroup (thead|tbody|tfoot) #IMPLIED -- enclosing row group -- |
968 |
rowclass CDATA #IMPLIED -- class of enclosing row -- |
969 |
celltype (th|td) #IMPLIED -- header, data or either -- |
970 |
cellclass CDATA #IMPLIED -- class of cell itself -- |
971 |
%cell.valign; |
972 |
> |
973 |
|
974 |
<!ATTLIST tr -- table row -- |
975 |
class CDATA #IMPLIED> |
976 |
|
977 |
<!ATTLIST (th|td) -- header or data cell -- |
978 |
class CDATA #IMPLIED> |
979 |
%cell.halign; -- horizontal alignment -- |
980 |
%cell.valign; -- vertical alignment -- |
981 |
axis CDATA #IMPLIED -- defaults to cell content -- |
982 |
axes CDATA #IMPLIED -- list of axis names -- |
983 |
> |
984 |
|
985 |
|
986 |
|
987 |
|
988 |
|
989 |
|
990 |
|
991 |
|
992 |
|
993 |
|
994 |
|
995 |
|
996 |
|
997 |
|
998 |
|
999 |
|
1000 |
|
1001 |
|
1002 |
|
1003 |
|
1004 |
|
1005 |
|
1006 |
|
1007 |
|
1008 |
|
1009 |
|
1010 |
|
1011 |
|
1012 |
|
1013 |
|
1014 |
|
1015 |
|
1016 |
|
1017 |
|
1018 |
|
1019 |
|
1020 |
Dave Raggett Page 17 |
1021 |
|