Ruka hadi kwa yaliyomo kuu Ruka hadi kwenye urambazaji wa hati
Check
in English

Mpangilio wa wima

Badilisha kwa urahisi mpangilio wima wa vipengee vya ndani, vya ndani, vya ndani, jedwali la ndani na kisanduku cha jedwali.

Badilisha mpangilio wa vitu na vertical-alignmenthuduma. Tafadhali kumbuka kuwa upangaji wa wima huathiri tu vipengele vya ndani, vya ndani, vya ndani, vya jedwali na kisanduku vya jedwali.

Chagua kutoka .align-baseline, .align-top, .align-middle, .align-bottom, .align-text-bottom, na .align-text-topinavyohitajika.

Ili kuweka kiwima maudhui yasiyo ya mstari (kama <div>s na zaidi), tumia huduma zetu za flex box .

Na vipengele vya ndani:

maandishi ya msingi juu katikati chini -juu maandishi-chini
html
<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>

Na seli za meza:

msingi juu katikati chini maandishi-juu maandishi-chini
html
<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

API ya Huduma

Huduma za kupanga wima zinatangazwa katika API ya huduma zetu katika scss/_utilities.scss. Jifunze jinsi ya kutumia API ya huduma.

    "align": (
      property: vertical-align,
      class: align,
      values: baseline top middle bottom text-bottom text-top
    ),