11_values_units
dz / mdn / css / 1_css_building_blocks / 11_values_unitsSummary
CSS Values and Units
Node Tree
- trig_funcs
- value_types
- css_rules
- functions
Nodes
css_rules | |
content | CSS Rules |
children | declarations |
declarations | |
content | Declarations |
children | props_and_values |
parents | css_rules |
props_and_values | |
content | Properties and Values |
parents | declarations |
value_types | |
content | Value Types |
children | position, unitless_numbers, collection_of_allowable_values, color, data_types (AKA), each_prop_has_value_type, image, numeric_types |
each_prop_has_value_type | |
content | Each property has a value type |
parents | value_types |
data_types | |
content | data types |
parents | value_types |
collection_of_allowable_values | |
content | A way to define a collection of allowable values |
parents | value_types |
numeric_types | |
content | Numeric types |
children | percentage, dimension, integer, number |
parents | value_types |
integer | |
content | <integer> |
parents | numeric_types |
number | |
content | <number> |
parents | numeric_types |
dimension | |
content | <dimension> |
children | length |
parents | numeric_types |
percentage | |
content | <percentage> |
parents | numeric_types |
length | |
content | <length> |
children | relative, absolute |
parents | dimension |
absolute | |
content | absolute |
parents | length |
relative | |
content | relative |
children | percentages, ems_rems, lh_rlh |
parents | length |
ems_rems | |
content | ems and rems |
children | lh_rlh (related) |
parents | relative |
lh_rlh | |
content | lh and rlh |
parents | ems_rems, relative |
percentages | |
content | percentages |
parents | relative |
unitless_numbers | |
content | unitless numbers |
children | opacity (example) |
parents | value_types |
opacity | |
content | opacity (0-1) |
parents | unitless_numbers |
color | |
content | Color |
children | rgb_rgba_vals, color_keywords, hex_rgb_vals, hue, other_color_funcs |
parents | value_types |
color_keywords | |
content | Color Keywords |
children | human_readable_text_value (description), keywords_are_identifiers, named_colors (AKA) |
parents | color |
named_colors | |
content | Named Colors |
parents | color_keywords |
human_readable_text_value | |
content | Human-readable text value |
parents | color_keywords |
hex_rgb_vals | |
content | Hexadecimal RGB Values |
parents | color |
rgb_rgba_vals | |
content | RGB/RGBA Values |
children | older_rgb_no_fourth_param |
parents | color |
hue | |
content | <hue> |
children | angle_specified, hsl |
parents | color |
older_rgb_no_fourth_param | |
content | Older versions of rgb() didn't take fourth parameter, used rgba() instead |
parents | rgb_rgba_vals |
angle_specified | |
content | Specified in <angle> |
parents | hue |
hsl | |
content | hsl() |
parents | hue |
other_color_funcs | |
content | Other color functions: hwb(), lch(), lab() |
parents | color |
image | |
content | <image> |
children | gradient, image_url |
parents | value_types |
image_url | |
content | (actual) image via url |
parents | image |
gradient | |
content | Gradient |
parents | image |
position | |
content | <position> |
children | position_keywords, 2d_coords_set (description), default_to_center |
parents | value_types |
2d_coords_set | |
content | Set of 2d coordinates |
parents | position |
default_to_center | |
content | If only one axis specified, the other value defaults to center |
parents | position, position_keywords |
position_keywords | |
content | Keywords: top, left, bottom, right, center |
children | default_to_center ("center" is a position keyword), keywords_are_identifiers |
parents | position |
remarks | The order these guides mention directions is consistently in cardinal-clockwise order |
keywords_are_identifiers | |
content | Keywords are more accurately described as identifiers |
children | not_quoted_not_strings |
parents | color_keywords, position_keywords |
not_quoted_not_strings | |
content | Not quoted, not strings |
parents | keywords_are_identifiers |
functions | |
content | functions |
children | transform_functions, math_funcs, more_color_funcs (example) |
more_color_funcs | |
content | rgb(), hsl() |
parents | functions |
transform_functions | |
content | Transform Functions: common way to move, rotate, and scale elements on a page |
parents | functions |
math_funcs | |
content | Math Functions |
children | calc, exponential_funcs, min_max_clamp |
parents | functions |
exponential_funcs | |
content | Exponential Functions |
parents | math_funcs |
calc | |
content | calc() |
parents | math_funcs |
min_max_clamp | |
content | min(), max(), clamp(): pick smallest, largest, and middle value from set of values |
parents | math_funcs |
trig_funcs | |
content | trig functions: sin(), cos(), tan() |