মূল বিষয়বস্তুলৈ এৰি যাওক নথিপত্ৰ নেভিগেচনলৈ এৰি যাওক
Check
in English

আৰ এফ এছ

বুটষ্ট্ৰেপৰ পুনৰ আকাৰ দিয়া ইঞ্জিনে প্ৰতিক্ৰিয়াশীলভাৱে সাধাৰণ CSS বৈশিষ্ট্যসমূহ স্কেল কৰে দৰ্শনপৰ্টসমূহ আৰু ডিভাইচসমূহৰ মাজেৰে উপলব্ধ স্থান উন্নত ব্যৱহাৰ কৰিবলে।

আৰ এফ এছ কি?

বুটষ্ট্ৰেপৰ পাৰ্শ্ব প্ৰকল্প RFS এটা একক আকাৰ সলনি কৰা ইঞ্জিন যি প্ৰথমতে আখৰৰ আকাৰ সলনি কৰিবলে বিকশিত কৰা হৈছিল (সেয়েহে ইয়াক প্ৰতিক্ৰিয়াশীল আখৰৰ আকাৰৰ বাবে সংক্ষিপ্ত ৰূপ দিয়া হৈছিল) । আজিকালি RFS এ বেছিভাগ CSS বৈশিষ্ট্যসমূহক একক মানসমূহৰ সৈতে পুনৰ স্কেলিং কৰিবলৈ সক্ষম যেনে margin, padding, border-radius, বা আনকি box-shadow

ব্ৰাউজাৰ ভিউপৰ্টৰ মাত্ৰাৰ ওপৰত ভিত্তি কৰি ব্যৱস্থাটোৱে স্বয়ংক্ৰিয়ভাৱে উপযুক্ত মানসমূহ গণনা কৰে। ইয়াক প্ৰতিক্ৰিয়াশীল স্কেলিং আচৰণ সামৰ্থবান কৰিবলে আৰু দৰ্শনপৰ্ট এককসমূহৰ calc()মিশ্ৰণৰ সৈতে ফাংচনসমূহত কম্পাইল কৰা হ'ব ।rem

RFS ব্যৱহাৰ কৰি

মিক্সিনসমূহ Bootstrap ত অন্তৰ্ভুক্ত কৰা হৈছে আৰু আপুনি Bootstrap সমূহ অন্তৰ্ভুক্ত কৰিলে উপলব্ধ হয় scssপ্ৰয়োজন হ'লে RFS স্বতন্ত্ৰ সংস্থাপন কৰিব পাৰি ।

মিক্সিন ব্যৱহাৰ কৰি

মিক্সিনৰ rfs()চৰ্টহেণ্ড আছে font-size, margin, margin-top, margin-right, margin-bottom, margin-left, padding, padding-top, padding-right, padding-bottom, আৰু padding-left. উৎস Sass আৰু কম্পাইল কৰা CSS ৰ বাবে তলৰ উদাহৰণ চাওক।

.title {
  @include font-size(4rem);
}
.title {
  font-size: calc(1.525rem + 3.3vw);
}

@media (min-width: 1200px) {
  .title {
    font-size: 4rem;
  }
}

rfs()আন যিকোনো বৈশিষ্ট্য মিক্সিনলৈ এনেদৰে পাছ কৰিব পাৰি :

.selector {
  @include rfs(4rem, border-radius);
}

!importantআপুনি বিচৰা মূল্যত যোগ কৰিব পাৰি:

.selector {
  @include padding(2.5rem !important);
}

ফাংচনসমূহ ব্যৱহাৰ কৰি

যেতিয়া আপুনি includes ব্যৱহাৰ কৰিব নিবিচাৰে, তেতিয়া দুটা কাৰ্য্যও আছে:

  • rfs-value()এটা মানক এটা মানলৈ ৰূপান্তৰিত কৰে remযদি এটা pxমান পাছ কৰা হয়, অন্য ক্ষেত্ৰত ই একে ফলাফল দিয়ে।
  • rfs-fluid-value()এটা মানৰ তৰল সংস্কৰণ ঘূৰাই দিয়ে যদি বৈশিষ্ট্যক পুনৰ স্কেলিং কৰাৰ প্ৰয়োজন হয়।

এই উদাহৰণত, আমি কেৱল ব্ৰেকপইন্টৰ তলত ষ্টাইলিং প্ৰয়োগ কৰিবলে Bootstrap ৰ এটা বিল্ট-ইন প্ৰতিক্ৰিয়াশীল ব্ৰেকপইন্ট মিক্সিনlg ব্যৱহাৰ কৰো ।

.selector {
  @include media-breakpoint-down(lg) {
    padding: rfs-fluid-value(2rem);
    font-size: rfs-fluid-value(1.125rem);
  }
}
@media (max-width: 991.98px) {
  .selector {
    padding: calc(1.325rem + 0.9vw);
    font-size: 1.125rem; /* 1.125rem is small enough, so RFS won't rescale this */
  }
}

সম্প্ৰসাৰিত নথিপত্ৰ

RFS হৈছে বুটষ্ট্ৰেপ প্ৰতিষ্ঠানৰ অধীনত এটা পৃথক প্ৰকল্প। RFS আৰু ইয়াৰ বিন্যাসৰ বিষয়ে অধিক ইয়াৰ GitHub ভঁৰালত পোৱা যাব ।