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 минути