आर एफ एस

आरएफएस की अछि ?

बूटस्ट्रैप केरऽ साइड प्रोजेक्ट आरएफएस एगो यूनिट रिसाइजिंग इंजन छै जेकरा शुरू म॑ फॉन्ट साइज बदलै लेली विकसित करलऽ गेलऽ छेलै (अतः एकरऽ संक्षिप्त रूप रिस्पांसिव फॉन्ट साइज लेली) । आजकल आरएफएस अधिकांश CSS गुण कें यूनिट मान जैना margin, padding, border-radius, या यहां तक ​​कें साथ रिस्केल करय मे सक्षम छै box-shadow.

तंत्र स्वचालित रूप सं ब्राउज़र व्यूपोर्ट कें आयाम कें आधार पर उचित मान कें गणना करयत छै. एकरा प्रतिक्रियाशील स्केलिंग व्यवहार कें सक्षम बनावा कें लेल आ व्यूपोर्ट इकाइयक कें calc()मिश्रण कें साथ फंक्शनक मे संकलित कैल जेतय .rem

आरएफएस के प्रयोग

मिक्सिन बूटस्ट्रैप मे शामिल अछि आओर एक बेर जखन अहां बूटस्ट्रैप के शामिल करब त उपलब्ध अछि scss. जरूरत पड़ला पर आरएफएस कें स्टैंडअलोन सेहो इंस्टॉल कैल जा सकय छै.

मिक्सिन के प्रयोग से

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()यदि गुण कें पुनर्स्केल करय कें जरूरत छै त कोनों मान कें द्रव संस्करण वापस करयत छै.

एहि उदाहरण मे, हम बूटस्ट्रैप क बिल्ट-इन रिस्पांसिव ब्रेकपॉइंट मिक्सिन मे स एकटा क उपयोग केवल 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 */
  }
}

विस्तारित दस्तावेजीकरण

आरएफएस बूटस्ट्रैप संगठन कें तहत एकटा अलग परियोजना छै. आरएफएस आओर ओकर विन्यास क बारे मे बेसी जानकारी एकर GitHub भंडार पर भेट सकैत अछि .