CSS glossary: Freelancer level

64 CSS terms at the Freelancer level, each with a short definition and a link to its full page.

Updated

Study these as flash cards

!important
Makes a declaration beat normal ones regardless of specificity.
:has()
Styles an element based on what it contains.
:is()
Matches any selector in its list.
:not()
Matches elements that don't match the selector inside.
:where()
Like :is() but with zero specificity, so easy to override.
@container
Writes a container query.
@font-face
Names a font and says where to download it.
@layer
Declares cascade layers or puts rules into one.
@scope
Limits rules to part of the page, with an optional inner boundary.
all property
Resets every property of an element at once.
Aspect ratio
Keeps width and height in proportion, like 16/9.
Block axis
The direction paragraphs stack.
calc()
Does math in CSS, even mixing units.
Cascade layer
A named group of styles ranked in the cascade, regardless of specificity.
Cascade origin
Where a style comes from: browser, user or site.
clamp()
Keeps a value between a minimum and maximum, flexible in between.
Column count
Sets how many columns text flows into.
Column span
Makes an element stretch across all the columns.
Column width
Sets an ideal column width; the browser fits as many as it can.
Container name
Names a query container so queries can target it.
Container query
Styles an element based on its container's size, not the screen's.
Container query units
Units like cqw that measure the container, like vw measures the screen.
Container type
Turns an element into a query container.
CSS nesting
Writing child rules inside a parent rule.
Current color
Means "the current text color".
Custom font
A font file your site loads so everyone sees the same typeface.
Custom property
A named, reusable value like --brand-color, read with var().
Custom property fallback
The backup value in var(), used when the property isn't set.
exportparts
An attribute that exposes selected part names from a nested shadow tree through its host.
Fit content
Sizes to the content, but no larger than the space available.
Font fallback
The next font in the list, used if the first isn't available.
Functional pseudo-class
A pseudo-class that takes selectors in brackets, like :not().
inherit
Takes the value from the parent element.
initial
Resets a property to CSS's built-in default.
Inline axis
The direction text runs along a line.
Intrinsic sizing
Sizing an element by its content rather than a set width.
Logical border
Borders like border-inline-start that follow text direction.
Logical margin
Margins like margin-inline-start that follow text direction.
Logical padding
Padding like padding-inline that follows text direction.
Logical properties
Properties that use start/end instead of left/right.
Logical size
inline-size and block-size: width and height that follow text direction.
max()
Uses the largest of several values.
Maximum content size
The size content wants with no wrapping.
min()
Uses the smallest of several values.
Minimum content size
The smallest size without content spilling out.
Multi-column layout
Flows text into newspaper-style columns.
Nesting selector
& in nested CSS: stands for the parent selector.
part attribute
An attribute naming parts inside a shadow tree so external CSS can select them.
Query container
An element whose size its contents can query.
Relative color
Builds a new color from an existing one, like a lighter brand color.
revert
Rolls a property back to the browser's own style.
revert-layer
Rolls a property back to the previous cascade layer's value.
Scoped styles
Styles that only apply inside one part of the page.
Scoping proximity
When scoped rules clash, the closer scope wins.
Scroll margin
Leaves space around an element when scrolled to it.
Scroll padding
Space inside a scroll area that scrolled-to items stay clear of.
Scroll snapping
Makes scrolling settle neatly on each item.
Specificity calculation
Count ids, then classes, then tags; compare left to right.
Style query
Applies styles based on a container's custom property values.
Subgrid
Lets a nested grid reuse its parent's rows or columns.
unset
Inherits if the property normally inherits, otherwise resets.
var()
Reads the value of a custom property.
Variable font
One font file holding a whole range of weights and widths.
Writing mode
Sets which way text flows: across or down.

Every CSS term, by level