术语库

Flexbox

让一组元素沿一个方向（横向或纵向）排成一排，并方便地控制对齐、间距和伸缩的 CSS 布局方式。

CSS Grid

把区域划分成由行和列组成的网格，再把元素放进格子里，适合行列都要对齐的二维布局。

Box Model

浏览器把每个元素都看成一个矩形盒子，由内到外依次是内容、内边距、边框和外边距四层。

Margin & Padding

内边距是边框以内、内容周围的空间，外边距是边框以外、这个元素和其他元素之间的距离。

Whitespace

页面上刻意留出的空白区域，用来分隔内容、突出重点，让界面看起来不拥挤、更容易阅读。

Responsive Design

同一套页面根据屏幕宽度自动调整布局，在手机、平板和电脑上都能正常浏览和操作。

Breakpoint

响应式布局里切换样式的屏幕宽度临界值，比如宽度小于 768px 时从两栏变成一栏。

Media Query

CSS 里按条件生效的样式规则，比如屏幕宽度小于 768px、系统开启深色模式时才应用某些样式。

CSS Position

用 position 属性让元素脱离正常的排列顺序，按指定偏移量摆放，常用于角标、悬浮按钮和固定导航栏。

z-index

元素重叠时决定谁显示在上面的 CSS 属性，数值越大越靠前，常用于弹窗、下拉菜单和吸顶导航。

Overflow

内容超出容器大小时的处理方式：露在外面、裁掉、出现滚动条，或者把长文字截断成省略号。

Typography

对文字的字体、字号、字重、行高、间距和颜色做整体规划，让内容清晰易读、主次分明。

Line Height

一行文字所占的高度，决定多行文字之间的疏密，正文通常设为字号的 1.5 到 1.8 倍。

Font Weight

文字笔画的粗细程度，用 100 到 900 的数值表示，400 是常规，700 是粗体，用来区分信息主次。

Color Palette

界面使用的一整套颜色及用法规则，包括品牌主色、黑白灰中性色和表示成功、警告、错误的功能色。

Color Contrast

文字颜色和背景颜色之间的明暗差异，差异太小会看不清，无障碍标准要求正文对比度至少 4.5:1。

Border Radius

把元素的直角变成圆弧的 CSS 效果，数值越大越圆，是决定界面风格偏硬朗还是偏柔和的关键之一。

Box Shadow

在元素下方加一层模糊的暗影，让它看起来浮在页面之上，阴影越大越柔，元素显得越高。

Dark Mode

用深色背景搭配浅色文字的界面配色方案，可以跟随系统设置自动切换，也可以让用户手动选择。

CSS Custom Properties

在 CSS 里给一个值起名字、存起来反复使用，改一处就能全局生效，常用来管理颜色、间距和主题。

Design Token

把颜色、字号、间距、圆角、阴影等设计决定抽成有名字的变量，让设计稿和各端代码共用同一套规范。

Tailwind CSS

工具类优先的 CSS 框架，直接在 class 里写 flex、p-4、text-lg 这样的短类名来完成样式。

Visual Hierarchy

用大小、粗细、颜色、位置和留白区分信息的主次，让用户一眼看出先看什么、再看什么、该点哪里。

Alignment

让页面元素沿着同一条看不见的线排列，比如左对齐、居中、右对齐、垂直居中，让界面整齐有序。

CSS Units

表示长度的单位，常用的有固定像素 px、跟随字号的 rem 和 em、按窗口比例的 vw、vh，以及百分比。

Icon

用简洁的小图形表示操作或含义，比如放大镜表示搜索、垃圾桶表示删除，通常来自统一风格的图标库。