Unit D Flashcards
CSS Laying Out Elements
Treats each element as a rectangular box having several global properties.
box model
Represents a line around an element formatted with the width, style, and color that you specify, is the only one that can be seen in a web browser. Serves as a reference point for the other two properties.
border
Space inside a border between the border and the element content
Padding
Space outside the border between the border and adjacent or parent elements.
margin
Ems, percent, and rems. Calculated based on the sizes of other elements on a web page.
relative units
Pixels. Represent a specific length or height that doesn’t change.
absolute units
How to set box properties?
Create declarations that assign values to the properties like margin, border and property.
Values to multiple CSS properties. For example, box model uses these properties for all four sides of an element—with a single declaration.
shorthand properties
resets one or more common properties (for example, border) of multiple elements to a common baseline, ensuring that default values that may be different between browsers do not cause a web page to be displayed inconsistently.
reset rule
default arrangement of elements
normal flow
Elements that follow an element to wrap around it, rather than being stacked below it. The left and right values of this property align the element horizontally with the left or right edge of the parent element, respectively, and allow elements that follow to fill in the remaining horizontal space.
float property
Prevents floated elements from being displayed to the left, right, or on either side of another element.
clear property
Element remaining in the same position in the browser window while a user scrolls the remaining page content. To implement this positioning, you use the position property with a value of fixed. You then specify either a horizontal position using the left or right property, or a vertical position using the top or bottom property, or both a horizontal and vertical position.
fixed positioning
filler text
lorem ipsum
Allows you to make adjustments to the default position of an element while preserving the space allotted to the element in the normal flow.
relative positioning