Web Page Design - Manual Part 1
CSS Box
What is the CSS Box Model ?
- CSS designs the web document as a series of boxes containing words, lines, paragraphs,
tables, etc.
each with properties such as size, color and font.
- This page describes the CSS box...
More
Web Page Design - Manual Part 1
CSS Box
What is the CSS Box Model ?
- CSS designs the web document as a series of boxes containing words, lines, paragraphs,
tables, etc.
each with properties such as size, color and font.
- This page describes the CSS box in order to understand the assignments in this manual.
If you want to know more please refer to http://www.
w3.
org/TR/CSS2/box.
html
CSS Box Model
The CSS Box Model
- The CSS box model has a content which can be surrounded respectively by
padding, border, margin.
Text, image,
line, paragraph,
table .
.
.
Box Content:
Padding
Border
Margin
top
top
top
Padding
Padding
Padding
right
right
right
Border
Margin
Margin
Margin
Border
Border
bottom
bottom
bottom
left
left
left
1
2
3
4
Direction of pixel values -->
CSS Box Model Coding
- To code a box with padding, border & margin distances is done as follows
(the words top, right etc are replaced by values)
- An example: a paragraph with a heading & an image can be placed within CSS
box
Less
