cis 1315 – web development for educators cis 1315 html tutorial 5: working with tables
TRANSCRIPT
CIS 1315 – Web Development for Educators
CIS 1315
HTMLTutorial 5: Working with Tables
CIS 1315 – Web Development for Educators
<table>
<table>…</table>
Structure to Control Page Layout
Structure to Contain & Align Content
Attributes
border=“#”
Sets Thickness of Borders Displayed for Table Cells
Attribute Set to 0 Will Make Borders “Invisible”
CIS 1315 – Web Development for Educators
<table>
Attributes
cellpadding=“#”
Specifies Amount of Space Between Cell & Content in Cell
cellspacing=“#”
Specifies Amount of Space Between Cells
frame=“above | below | border | box | hsides | lhs | rhs | void | vsides”
Specifies Where Borders of Tables & Cells Appear
CIS 1315 – Web Development for Educators
<table>
Attributes height=“# | %”
Specifies Height of Table in Pixels or Percentage of Window
rules=“all | cols | groups | none | rows”
Specifies Where Gridlines Appear in a Table
valign=“top | bottom | middle ”
Specifies Vertical Alignment of Text in Cells
width=“# | %”
Specifies Width of Table in Pixels or Percentage of Window
CIS 1315 – Web Development for Educators
<table>
frame
CIS 1315 – Web Development for Educators
<table>
rules
CIS 1315 – Web Development for Educators
<colgroup>
<colgroup>…</colgroup>
Defines Groups of Table Columns for Formatting
Only Valid Inside <table>
Attributes
align=“left | center | right | justify | char”
Specifies Horizontal Alignment of Contents in Column Group
char=“character”
Specifies Character to Use to Align Text On
CIS 1315 – Web Development for Educators
<colgroup>
Attributes
span=“#”
Specifies Number of Columns <colgroup> Should Span
valign=“top | middle | bottom | baseline”
Specifies Vertical Alignment of Contents in <colgroup>
width=“# | %”
Specifies Width of Each Column in <colgroup>
0* - Column Width Should be Minimum Width
CIS 1315 – Web Development for Educators
<col>
<col />
Defines One or More Columns of Table for Formatting
Only Valid Inside <table> or <colgroup>
Attributes
align=“left | center | right | justify | char”
Specifies Horizontal Alignment of Contents in Table Column
char=“character”
Specifies Character to Use to Align Text On
CIS 1315 – Web Development for Educators
<col>
Attributes
span=“#”
Specifies Number of Columns the Column Should Span
valign=“top | middle | bottom | baseline”
Specifies Vertical Alignment of Contents in Table Column
width=“# | %”
Specifies Width of Column
0* - Column Width Should be Minimum Width
CIS 1315 – Web Development for Educators
<tr> & <td>
<tr>…</tr>
Defines a Row in a Table
<td>…</td>
Defines Table Data (a Cell) in a Row
Table Data Cells Must Only Appear Within Table Rows
Closing Tag Must Appear on Same Line as Content
Otherwise Gapping May Occur
CIS 1315 – Web Development for Educators
<td>
Attributes
colspan=“#”
Specifies How Many Columns the Cell Overlaps
rowspan=“#”
Specifies How Many Rows the Cell Overlaps
CIS 1315 – Web Development for Educators
<th> & <caption>
<th>…</th>
Specifies the Table Header for a Row
Identical to Table Data Cells Except:
Cells Contents are Bolded
Cells Contents are Centered
<caption>…</caption>
Attaches a Caption to a Table