語法
最大寬度max-width
Setting the maximum width of an element.
Overview
Class | Declarations |
---|---|
max-w:size | max-width: size/16rem;
|
max-vw | max-width: 100vw;
|
max-w:full | max-width: 100%;
|
max-w:fit | max-width: fit-content;
|
max-w:min | max-width: min-content;
|
max-w:max | max-width: max-content;
|
max-w:screen-4xs | max-width: 22.5rem;
|
max-w:screen-3xs | max-width: 30rem;
|
max-w:screen-2xs | max-width: 37.5rem;
|
max-w:screen-xs | max-width: 48rem;
|
max-w:screen-sm | max-width: 52.125rem;
|
max-w:screen-md | max-width: 64rem;
|
max-w:screen-lg | max-width: 80rem;
|
max-w:screen-xl | max-width: 90rem;
|
max-w:screen-2xl | max-width: 100rem;
|
max-w:screen-3xl | max-width: 120rem;
|
max-w:screen-4xl | max-width: 160rem;
|
Conditionally apply
Apply styles based on different states using selectors and applying conditionally.
<div class="max-w:full:hover max-w:full@sm max-w:full@dark max-w:full@print">…</div>