Page 127 - CodePilot V5.0 C7

In the preceding code, the BACKGROUND-COLOR and COLOR properties are used to set the
background colour and text colour.

Ask
AGENT
OrangeAI
Design a table in HTML that includes a header row and apply CSS to style the header.

Study

USING THE PADDING PROPERTY
Padding is the space inside an element’s border. The PADDING property sets space on all four

sides in one declaration, using units like pixels or percentages. By default, padding is set to 0.

Syntax: PADDING: PADDING-TOP PADDING-RIGHT PADDING-BOTTOM PADDING-LEFT;
If less than four values are given in the PADDING property, then the rest are assumed on the basis
of the given values.

For example:

PADDING: 20PX 20PX 20PX;
This sets the padding as follows: Top to 20px, Right and Left to 20px and Bottom to 20px.

PADDING: 20PX 20PX;

This sets the padding as follows: Top and Bottom to 20px and Right and Left to 20px.

PADDING: 20PX;
This sets the padding to 20px on all four sides — Top, Right, Bottom and Left.

USING THE CAPTION-SIDE PROPERTY
The CAPTION-SIDE property states the position of the table caption. It can be at the top or bottom.

Syntax: CAPTION-SIDE: VALUE;
For example:

CAPTION-SIDE: BOTTOM;
The preceding code will position the caption of the table below the table.

USING THE WIDTH PROPERTY

The CSS WIDTH property specifies the width of the element’s content area.

Syntax: WIDTH: value;
For example:

WIDTH: 70%;
The preceding code sets the width of the element to 70% of its parent element.

125
Lists and Tables in HTML5