Spaces
Наименования CSS классов для отступов состоят из нескольких частей: {prefix}-{p/m-side}-{size}
.
Prefix
prefix
- Префикс cds
,
P/M
p
- padding, используется для внутренних отступов.
m
- margin, используется для внешних отступов.
Side
a
- all, значение применяется для всех сторон.
t
- top, применяется для верхней части элемента.
r
- right, применяется только для правой части элемента.
b
- bottom, применяется только для нижней части элемента.
l
- left, применяется только для левой части элемента.
x
- применяется для сторон по оси x.
y
- применяется для сторон по оси y.
Примеры
CSS-класс | Свойство |
---|---|
.cds-pa-m | padding: 16px; |
.cds-pt-m | padding-top: 16px; |
.cds-pr-xl | padding-right: 32px; |
.cds-mb-xl | margin-bottom: 32px; |
.cds-ml-xs | margin-left: 8px; |
.cds-mx-xs | margin-right: 8px; margin-left: 8px; |
.cds-my-none | margin-top: 0; margin-bottom: 0; |
Значения
Значение | Size (rem/px) | Mini unit |
---|---|---|
none | 0px | 0 |
3xs | 0.125 / 2 | 0.25 |
xxs | 0.25 / 4 | 0.5 |
xs | 0.5 / 8 | 1 |
s | 0.75 / 12 | 1.5 |
m | 1 / 16 | 2 |
l | 1.5 / 24 | 3 |
xl | 2 / 32 | 4 |
xxl | 2.5 / 40 | 5 |
3xl | 3 / 48 | 6 |
4xl | 4 / 64 | 8 |
5xl | 5 / 80 | 10 |
6xl | 6 / 96 | 12 |