Bootstrap thiab Masonry

Kev koom ua ke Masonry nrog Bootstrap daim phiaj system thiab daim npav tivthaiv.

Masonry tsis suav nrog hauv Bootstrap. Ntxiv nws los ntawm kev suav nrog JavaScript plugin manually, lossis siv CDN zoo li:


<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>
  

Los ntawm kev ntxiv data-masonry='{"percentPosition": true }'rau lub .rowwrapper, peb tuaj yeem ua ke lub zog ntawm Bootstrap lub teb cov kab sib chaws thiab Masonry qhov chaw.


Placeholder Image cap
Daim npav npe uas qhwv rau kab tshiab

Qhov no yog daim npav ntev dua nrog cov ntawv txhawb nqa hauv qab no raws li kev coj mus rau hauv cov ntsiab lus ntxiv. Cov ntsiab lus no ntev me ntsis.

Ib qho zoo-paub quotes, muaj nyob rau hauv ib lub ntsiab lus blockquote.

Placeholder Image cap
Daim npav npe

Daim npav no muaj kev txhawb nqa cov ntawv hauv qab no raws li kev coj mus rau hauv cov ntsiab lus ntxiv.

Hloov tshiab kawg 3 mins dhau los

Ib qho zoo-paub quotes, muaj nyob rau hauv ib lub ntsiab lus blockquote.

Daim npav npe

Daim npav no muaj lub npe tsis tu ncua thiab kab lus luv luv ntawm cov ntawv hauv qab nws.

Hloov tshiab kawg 3 mins dhau los

Placeholder Card image

Ib qho zoo-paub quotes, muaj nyob rau hauv ib lub ntsiab lus blockquote.

Daim npav npe

Nov yog lwm daim npav nrog lub npe thiab txhawb cov ntawv hauv qab no. Daim npav no muaj qee cov ntsiab lus ntxiv los ua kom nws siab me ntsis tag nrho.

Hloov tshiab kawg 3 mins dhau los