語法
內容對齊方式justify-content
Controlling how items are aligned along its main axis.
Overview
Class | Declarations |
---|---|
justify-content:justify | justify-content: justify;
|
justify-content:normal | justify-content: normal;
|
justify-content:left | justify-content: left;
|
justify-content:center | justify-content: center;
|
justify-content:right | justify-content: right;
|
justify-content:stretch | justify-content: stretch;
|
justify-content:start | justify-content: start;
|
justify-content:end | justify-content: end;
|
justify-content:flex-start | justify-content: flex-start;
|
justify-content:flex-end | justify-content: flex-end;
|
justify-content:space-around | justify-content: space-around;
|
justify-content:space-between | justify-content: space-between;
|
justify-content:space-evenly | justify-content: space-evenly;
|
justify-content:center-content | justify-content: center-content;
|
Conditionally apply
Apply styles based on different states using selectors and applying conditionally.
<div class="justify-content:normal:hover justify-content:normal@sm justify-content:normal@dark justify-content:normal@print">…</div>