मुख्य सामग्री पर जाओ डॉक्स नेविगेशन पर जाओ
Check
in English

आर एफ एस

बूटस्ट्रैप दा आकार बदलने आह् ला इंजन प्रतिक्रियाशील रूप कन्नै आम CSS गुणें गी स्केल करदा ऐ तां जे पूरे व्यूपोर्ट ते डिवाइस च उपलब्ध जगह दा बेहतर उपयोग कीता जाई सकै।

आरएफएस केह् ऐ ?

बूटस्ट्रैप दा साइड प्रोजेक्ट आरएफएस इक इकाई आकार बदलने आह् ला इंजन ऐ जेह् ड़ा शुरू च फॉन्ट आकार बदलने आस्तै विकसित कीता गेआ हा (इस करी इसदा संक्षिप्त रूप रिस्पांसिव फॉन्ट आकारें आस्तै कीता गेआ ऐ)। अज्जकल आरएफएस margin, padding, border-radius, जां इत्थूं तगर जे इकाई मूल्यें कन्नै मते सारे CSS गुणें गी पुनर्स्केल करने च समर्थ ऐ 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. स्रोत सस्स ते संकलित सीएसएस आस्तै हेठ दित्ते गेदे उदाहरन दिक्खो।

.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);
}

फंक्शनें दा इस्तेमाल करदे होई

जदूं तुस इन्क्लूड्स दा इस्तेमाल नेईं करना चांह् दे ओ तां दो फंक्शन बी होंदे न:

  • 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 */
  }
}

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

आरएफएस बूटस्ट्रैप संगठन दे अंतर्गत इक बक्खरा प्रोजेक्ट ऐ। RFS ते इसदे कॉन्फ़िगरेशन दे बारे च होर मता इसदे GitHub रिपोजिटरी पर दिक्खेआ जाई सकदा ऐ .