ወደ ዋናው ይዘት ዝለል ወደ ሰነዶች ዳሰሳ ዝለል
Check
in English

ተንሳፋፊ

የእኛን ምላሽ ሰጪ ተንሳፋፊ መገልገያዎችን በመጠቀም በማንኛውም አካል ላይ ተንሳፋፊዎችን በማንኛውም መግቻ ነጥብ ላይ ቀይር።

አጠቃላይ እይታ

እነዚህ የመገልገያ ክፍሎች የሲኤስኤስ floatንብረቱን በመጠቀም አሁን ባለው የመመልከቻ መጠን ላይ በመመስረት አንድን ንጥረ ነገር ወደ ግራ ወይም ቀኝ ይንሳፈፋሉ ወይም ተንሳፋፊን ያሰናክሉ ። !importantየልዩነት ጉዳዮችን ለማስወገድ ተካትቷል። እነዚህ እንደ ፍርግርግ ስርዓታችን ተመሳሳይ የመመልከቻ ነጥቦችን ይጠቀማሉ። እባክዎን ተንሳፋፊ መገልገያዎች በተለዋዋጭ እቃዎች ላይ ምንም ተጽእኖ እንደሌላቸው ይወቁ።

በሁሉም የእይታ መጠኖች ላይ ተንሳፋፊ ጅምር

በሁሉም የእይታ መጠኖች ላይ ተንሳፋፊ መጨረሻ

በሁሉም የእይታ መጠኖች ላይ አይንሳፈፉ
html
<div class="float-start">Float start on all viewport sizes</div><br>
<div class="float-end">Float end on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>

ምላሽ ሰጪ

floatለእያንዳንዱ እሴት ምላሽ ሰጪ ልዩነቶችም አሉ ።

ተንሳፋፊ የሚጀምረው ኤስኤም (ትንሽ) ወይም ሰፊ በሆነ የእይታ ወደቦች ላይ ነው።

ተንሳፋፊ የሚጀምረው ኤምዲ (መካከለኛ) ወይም ሰፊ በሆነ የእይታ ወደቦች ላይ ነው።

ተንሳፋፊ የሚጀምረው LG (ትልቅ) ወይም ሰፊ በሆነ የእይታ ወደቦች ላይ ነው።

ተንሳፋፊ የሚጀምረው XL (ተጨማሪ ትልቅ) ወይም ሰፊ በሆነ የእይታ ወደቦች ላይ ነው።

html
<div class="float-sm-start">Float start on viewports sized SM (small) or wider</div><br>
<div class="float-md-start">Float start on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-start">Float start on viewports sized LG (large) or wider</div><br>
<div class="float-xl-start">Float start on viewports sized XL (extra-large) or wider</div><br>

ሁሉም የድጋፍ ክፍሎች እነኚሁና:

  • .float-start
  • .float-end
  • .float-none
  • .float-sm-start
  • .float-sm-end
  • .float-sm-none
  • .float-md-start
  • .float-md-end
  • .float-md-none
  • .float-lg-start
  • .float-lg-end
  • .float-lg-none
  • .float-xl-start
  • .float-xl-end
  • .float-xl-none
  • .float-xxl-start
  • .float-xxl-end
  • .float-xxl-none

ሳስ

መገልገያዎች ኤፒአይ

ተንሳፋፊ መገልገያዎች በእኛ መገልገያዎች ኤፒአይ ውስጥ ይታወቃሉ scss/_utilities.scssየመገልገያ ኤፒአይን እንዴት መጠቀም እንደሚችሉ ይወቁ።

    "float": (
      responsive: true,
      property: float,
      values: (
        start: left,
        end: right,
        none: none,
      )
    ),