Ukuqondanisa okuqondile
Shintsha kalula ukuqondanisa okuqondile kwe-inline, inline-block, ithebula elisemgqeni, nama-elementi eseli lethebula.
Shintsha ukuqondanisa kwama-elementi vertical-alignment
nezinsiza. Sicela uqaphele ukuthi ukuqondanisa okuqondile kuthinta kuphela okungaphakathi komugqa, ukuvimba okusemgqeni, ithebula elisemgqeni, kanye nezakhi zamaseli ethebula.
Khetha kokuthi .align-baseline
, .align-top
, .align-middle
, .align-bottom
, .align-text-bottom
, futhi .align-text-top
njengoba kudingeka.
Ukuze umise phakathi ngokuqondile okuqukethwe okungaxhumene ne-inthanethi (njengo- <div>
s nokunye), sebenzisa izinsiza zethu zebhokisi le-flexible .
Ngezinto ezingaphakathi komugqa:
<span class="align-baseline">baseline</span>
<span class="align-top">top</span>
<span class="align-middle">middle</span>
<span class="align-bottom">bottom</span>
<span class="align-text-top">text-top</span>
<span class="align-text-bottom">text-bottom</span>
Ngamaseli ethebula:
isisekelo | phezulu | phakathi | phansi | umbhalo-phezulu | umbhalo-phansi |
<table style="height: 100px;">
<tbody>
<tr>
<td class="align-baseline">baseline</td>
<td class="align-top">top</td>
<td class="align-middle">middle</td>
<td class="align-bottom">bottom</td>
<td class="align-text-top">text-top</td>
<td class="align-text-bottom">text-bottom</td>
</tr>
</tbody>
</table>
Sass
I-Utilities API
Izinsiza zokuqondanisa okuqondile zimenyezelwa kuzinsiza zethu ze-API ku- scss/_utilities.scss
. Funda indlela yokusebenzisa i-API yezinsiza.
"align": (
property: vertical-align,
class: align,
values: baseline top middle bottom text-bottom text-top
),