Home >> Tutorials/FAQs >> CSS Tutorials >> Index
CSS Tutorials - HTML Element Formatting Model
By: FYICenter.com
(Continued from previous topic...)
What Is the HTML Element Formatting Model?
An HTML document is divided into HTML elements. Each element is considered as a formatting unit
using a box-oriented formatting model, which has:
- Content Box - A rectangular area for displaying the element content.
- Padding Box - A rectangular area surrounding the content box acting as padding space.
- Border Box - A rectangular area surrounding the padding box acting as border lines.
- Margin Box - A rectangular area surrounding the border box acting as margin space.
The diagram below shows you the content box of a paragraph and the surrounding layers:
(Continued on next topic...)
- What Is the HTML Element Formatting Model?
- What Are the Formatting Behaviors of HTML Elements?
- What Is a Block Element?
- What Is an Inline Element?
- What Is a Floating Element?
- Hot To Specify the Content Box Size of a Block Element?
- Hot To Specify Padding Spaces of a Block Element?
- Hot To Test Padding Spaces on All 4 Sides?
- How To Specify Borders of a Block Element?
- Hot To Test Borders with Different Widths, Styles, and Colors?
- How To Specify Margin Spaces of a Block Element?
- How To Test Margin Spaces on All 4 Sides?
- How To Specify the Color of the Margin Area?
- How To Specify the Color of the Padding Area?
- What Are the Background Properties of a Block Element?
- How To Set Background to Transparent or Non-transparent?
- How To Add Images to Backgrounds?
- What Is the Text Paragraph Formatting Model?
- How In-Line Elements Are Mixed in Text Lines?
- How In-line Elements Affect Line Box Heights?
- Is FORM a Block Element?
|