Help:Wiki University HTML-- Tables - Rows

Row backgrounds
If we are making changes to cells in a row, rather than putting code into each cell, we can put the coding in our row tags. Let's use our demonstration table again, this time without borders on the cells: Let's say we want to place a background color in the heading row, we simply add the background-color attribute to the row tag like so: |- style=" background-color: lightgreen " Our table will now look like this:

Changing font-family in rows
|- style=" background-color:lightgreen; font-family: new times roman "
 * If you are going to change the font-family in all the cells in a row, install the code in the row tag. Here we will add it to the background attribute like so:

Changing font-size in rows
|- style=" background-color:lightgreen; font-family:new times roman; font-size:  14pt "
 * To change the font-size in a row, install the code in the row tag. Here we will add it to the above changes like so:

Changing text color in rows
Let change text color to white with color attribute: |- style=" background-color:lightgreen; font-family:new times roman; font-size:14pt; color: white "

Changing height of rows
If you want the row to be taller, you can add the height attribute: |- style=" background-color:lightgreen; font-family:new times roman; font-size:14pt; color:white; height: 50px "

Attributes that DO NOT work in rows
These attributes DO NOT work in row tags and must be placed in each cell to function: width: text-align: border: padding:

Try these out


 Exercises
 * With our above table place a yellow border, "groove" style and 10 pixels thick.
 * Make the table 700 pixels wide.
 * Next place a blue border around the headers.
 * Give the header cells a light blue background.
 * Change the color of the font to white.

Check your answers

 Quick Quiz
 * To make all the cells in column the same you need only put the code in the top cell
 * A. True
 * B. False


 * Background color cannot be placed in cells through coding in row
 * A. True
 * B. False


 * You can change the font-family in the rows
 * A. True
 * B. False

Check your answers