ශ්‍රිතය repeating-radial-gradient

ශ්‍රිතය repeating-radial-gradient පුනරාවර්තන අරය දශාවාහිනියක් අර්ථ දක්වයි. මෙයින් අදහස් වන්නේ අපි දශාවාහිනියේ නිශ්චිත රටාවක් අර්ථ දක්වන බවයි, උදාහරණයක් ලෙස, 0px සිට 10px දක්වා - රතු පැහැයෙන් නිල් පැහැය දක්වා දශාවාහිනියක් සහ මෙම දශාවාහිනිය සම්පූර්ණ බ්ලොකය පුරාම පුනරාවර්තනය වේ: 0px සිට 10px දක්වා, 10px සිට 20px දක්වා, 20px සිට 30px දක්වා සහ එලෙසම ඉදිරියට.

ශ්‍රිතය ක්‍රියා කරන්නේ එකම පරාමිතීන් සමඟින් radial-gradient, හිදී මෙන්, වෙනස පවතින්නේ පුනරාවර්තන බලපෑමෙනි. පිළිගන්නා පරාමිතීන් radial-gradient විස්තරයෙන් බලන්න.

වාක්‍ය රීතිය

cssතෝරන්නා {
  background: repeating-radial-gradient([ආකෘති ප්‍රකාරය ස්ථානගත කිරීම], වර්ණ1 ප්‍රමාණය1, වර්ණ2 ප්‍රමාණය2...);
}

උදාහරණය

සංකේන්ද්‍රීය කව:

html<div id="elem"></div>
css#elem {
  background: repeating-radial-gradient(circle at center, red 0px, red 2px, white 2px, white 4px);
  width: 400px;
  height: 200px;
}

Результат:

උදාහරණය

සංකේන්ද්‍රීය දීර්ඝ වෘත්ත:

html<div id="elem"></div>
css#elem {
  background: repeating-radial-gradient(ellipse at center, red 0px, red 4px, white 4px, white 8px);
  width: 400px;
  height: 200px;
}

Результат:

උදාහරණය

සංකේන්ද්‍රීය කව මැදට නොව, දාරයට ස්ථානගත කරමු:

html<div id="elem"></div>
css#elem {
  background: repeating-radial-gradient(circle at 50px 100px, red 0px, red 2px, white 2px, white 4px);
  width: 400px;
  height: 200px;
}

Результат:

මෙයද බලන්න

  • ශ්‍රිතය repeating-linear-gradient,
    පුනරාවර්තන රේඛීය දශාවාහිනියක් සාදයි
  • ශ්‍රිතය linear-gradient,
    රේඛීය දශාවාහිනියක් සාදයි
  • ශ්‍රිතය radial-gradient,
    අරය දශාවාහිනියක් සාදයි