CSU Ram Head Logo

JTC 372

Web Design and Management

CSS Properties

Layout Properties

Width (width): set width of element
Height (height): set height of element
Min-width (min-width): set minimum width of element
Max-width (max-width): set maximum width of element
Min-height (min-height): set minimum height of element
Max-height (max-height): set maximum height of element
Display (display): sets display block or inline. Block has margin/padding. Also sets display to flex.
Padding (padding, padding-top, etc.): space inside border of element
Margin (margin, margin-top, etc.): space outside border
Float (float): Sets how elements align around element
Clear (clear): Stops elements from floating
Overflow : Contains floats

Type Properties

Color (color): Assign hex code
Font (font-family): Determines list of fonts
Style (font-style): Italic or not
Weight (font-weight): Bold or not
Size (font-size): pixels or ems
Text align (text-align): aligns content horizontally in container
Decoration (text-decoration): underline or not
Variant (text-transform): Capitalize, lowercase, uppercase
Vertical alignment (vertical-align): aligns content vertically in container
Type ( list-style-type): change bullet style or remove bullet
Image (list-style-image): assign image for bullet

Tags: body, p, hl-h6, a

Border (all three properties are necessary to define a border)

Style (border-style): solid, dashed, etc.
Width (border-width): width in pixels
Color (border-color): color in hex

Background Properties

Background color (background-color):  Assign hex code
Background image(background-image): assigns background image.
Repeat (background-repeat): Sets how bg image repeats
Horizontal position (background-position): Aligns bg image horizontally
Vertical position (background-position): Aligns bg image vertically

Tags: body, p, hl-h6, a, table, tr, td, div