Bootstrap ו-Masonry

שלב בנייה עם מערכת ה-Bootstrap גריד ורכיב הכרטיסים.

בנייה לא כלולה ב-Bootstrap. הוסף אותו על ידי הכללת תוסף 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, נוכל לשלב את הכוחות של הרשת המגיבה של Bootstrap והמיצוב של Masonry.


Placeholder Image cap
כותרת כרטיס שמתעטפת בשורה חדשה

זהו כרטיס ארוך יותר עם טקסט תומך למטה כהובלה טבעית לתוכן נוסף. התוכן הזה קצת יותר ארוך.

ציטוט ידוע, הכלול באלמנט blockquote.

Placeholder Image cap
כותרת הכרטיס

לכרטיס זה יש טקסט תומך למטה כהובלה טבעית לתוכן נוסף.

עודכן לאחרונה לפני 3 דקות

ציטוט ידוע, הכלול באלמנט blockquote.

כותרת הכרטיס

לכרטיס זה יש כותרת רגילה ופסקה קצרה של טקסט מתחתיו.

עודכן לאחרונה לפני 3 דקות

Placeholder Card image

ציטוט ידוע, הכלול באלמנט blockquote.

כותרת הכרטיס

זהו כרטיס נוסף עם כותרת וטקסט תומך למטה. לכרטיס זה יש תוכן נוסף כדי להפוך אותו למעט גבוה יותר בסך הכל.

עודכן לאחרונה לפני 3 דקות