ബൂട്ട്സ്ട്രാപ്പും കൊത്തുപണിയും

ബൂട്ട്‌സ്‌ട്രാപ്പ് ഗ്രിഡ് സിസ്റ്റവും കാർഡ് ഘടകവുമായി മേസൺറി സംയോജിപ്പിക്കുക .

ബൂട്ട്സ്ട്രാപ്പിൽ കൊത്തുപണി ഉൾപ്പെടുത്തിയിട്ടില്ല. JavaScript പ്ലഗിൻ സ്വമേധയാ ഉൾപ്പെടുത്തിക്കൊണ്ട് അല്ലെങ്കിൽ ഒരു CDN ഉപയോഗിച്ച് ഇത് ചേർക്കുക:


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
  

റാപ്പറിലേക്ക് ചേർക്കുന്നതിലൂടെ data-masonry='{"percentPosition": true }', .rowനമുക്ക് ബൂട്ട്‌സ്‌ട്രാപ്പിന്റെ റെസ്‌പോൺസീവ് ഗ്രിഡിന്റെയും മേസൺറിയുടെ പൊസിഷനിംഗിന്റെയും ശക്തികൾ സംയോജിപ്പിക്കാൻ കഴിയും.


Placeholder Image cap
ഒരു പുതിയ ലൈനിലേക്ക് പൊതിയുന്ന കാർഡ് ശീർഷകം

അധിക ഉള്ളടക്കത്തിലേക്കുള്ള സ്വാഭാവിക ലീഡ്-ഇൻ എന്ന നിലയിൽ ചുവടെ പിന്തുണയ്‌ക്കുന്ന ടെക്‌സ്‌റ്റുള്ള ദൈർഘ്യമേറിയ കാർഡാണിത്. ഈ ഉള്ളടക്കം അൽപ്പം ദൈർഘ്യമേറിയതാണ്.

ഒരു ബ്ലോക്ക്‌ക്വോട്ട് എലമെന്റിൽ അടങ്ങിയിരിക്കുന്ന അറിയപ്പെടുന്ന ഉദ്ധരണി.

Placeholder Image cap
കാർഡ് ശീർഷകം

അധിക ഉള്ളടക്കത്തിലേക്കുള്ള സ്വാഭാവിക ലീഡ്-ഇൻ എന്ന നിലയിൽ ഈ കാർഡിന് താഴെ പിന്തുണയ്‌ക്കുന്ന വാചകമുണ്ട്.

3 മിനിറ്റ് മുമ്പ് അവസാനം അപ്‌ഡേറ്റ് ചെയ്‌തു

ഒരു ബ്ലോക്ക്‌ക്വോട്ട് എലമെന്റിൽ അടങ്ങിയിരിക്കുന്ന അറിയപ്പെടുന്ന ഉദ്ധരണി.

കാർഡ് ശീർഷകം

ഈ കാർഡിന് താഴെ ഒരു സാധാരണ ശീർഷകവും വാചകത്തിന്റെ ചെറിയ ഖണ്ഡികയും ഉണ്ട്.

3 മിനിറ്റ് മുമ്പ് അവസാനം അപ്‌ഡേറ്റ് ചെയ്‌തു

Placeholder Card image

ഒരു ബ്ലോക്ക്‌ക്വോട്ട് എലമെന്റിൽ അടങ്ങിയിരിക്കുന്ന അറിയപ്പെടുന്ന ഉദ്ധരണി.

കാർഡ് ശീർഷകം

ശീർഷകവും പിന്തുണയ്‌ക്കുന്ന വാചകവും ഉള്ള മറ്റൊരു കാർഡാണിത്. ഈ കാർഡിന് മൊത്തത്തിൽ അൽപ്പം ഉയരം കൂട്ടാൻ ചില അധിക ഉള്ളടക്കമുണ്ട്.

3 മിനിറ്റ് മുമ്പ് അവസാനം അപ്‌ഡേറ്റ് ചെയ്‌തു