RFS

Dè a th' ann an RFS?

Tha pròiseact taobh Bootstrap RFS na einnsean ath-mheudachadh aonad a chaidh a leasachadh an toiseach gus meudan cruth-clò ath-mheudachadh (mar sin an giorrachadh airson Meudan Cruth Responsive). An-diugh tha RFS comasach air a’ mhòr-chuid de thogalaichean CSS ath-sgèileadh le luachan aonad mar margin, padding, , border-radius, no eadhon box-shadow.

Bidh an uidheamachd gu fèin-obrachail a’ tomhas nan luachan iomchaidh stèidhichte air tomhasan sealladh-seallaidh a’ bhrobhsair. Bidh e air a chur ri chèile ann an calc()gnìomhan le measgachadh de remdh'aonadan sealladh agus sealladh gus an giùlan sgèile freagairteach a chomasachadh.

A 'cleachdadh RFS

Tha na measgachaidhean air an toirt a-steach do Bootstrap agus tha iad rim faighinn aon uair ‘s gu bheil thu a’ toirt a-steach Bootstrap's scss. Faodar RFS a chuir a-steach leis fhèin cuideachd ma tha feum air.

A 'cleachdadh measgachadh

Tha rfs()làmhan-goirid aig a’ mheasgachadh airson font-size, margin, margin-top, margin-right, margin-bottom, margin-left, padding, padding-top, padding-right, padding-bottom, agus padding-left. Faic an eisimpleir gu h-ìosal airson stòr Sass agus CSS air a chur ri chèile.

.title {
  @include font-size(4rem);
}

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

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

Faodar seilbh sam bith eile a thoirt don rfs()mheasgachadh mar seo:

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

!importantfaodar cuideachd a chur ris ge bith dè an luach a tha thu ag iarraidh:

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

A 'cleachdadh ghnìomhan

Nuair nach eil thu airson na in-ghabhail a chleachdadh, tha dà ghnìomh ann cuideachd:

• rfs-value()tionndaidh luach gu remluach ma thèid pxluach seachad, ann an cùisean eile tillidh e an aon toradh.
• rfs-fluid-value()a’ tilleadh an tionndadh siùbhlach de luach ma tha feum air an togalach ath-sgèile.

San eisimpleir seo, bidh sinn a’ cleachdadh aon de na measgachaidhean brisidh freagairteach togte Bootstrap gus dìreach stoidhle a chuir an sàs fon àite lgbrisidh.

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

Sgrìobhainnean leudaichte

Tha RFS na phròiseact air leth fon bhuidheann Bootstrap. Gheibhear barrachd mu RFS agus an rèiteachadh aige air an stòr GitHub aige .