Bootstrap 4 objets multimédias

Objets multimédias

Bootstrap offre un moyen simple d'aligner des objets multimédias (comme des images ou des vidéos) avec du contenu. Les objets médias sont souvent utilisés pour afficher des commentaires de blog, des tweets, etc. :

John Doe Publié le 19 février 2016

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

John Doe Publié le 20 février 2016

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

Objet multimédia de base

John Doe Publié le 19 février 2016

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

Pour créer un objet multimédia, ajoutez la .mediaclasse à un élément conteneur et placez le contenu multimédia dans un conteneur enfant avec la .media-bodyclasse. Ajoutez du remplissage et des marges selon vos besoins, avec les utilitaires d'espacement :

Objets multimédias imbriqués

Les objets média peuvent également être imbriqués (un objet média dans un objet média) :

John Doe Publié le 19 février 2016

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

Jane Doe Publié le 20 février 2016

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

Pour imbriquer des objets multimédias, placez un nouveau .mediaconteneur à l'intérieur du .media-bodyconteneur :

Image média alignée à droite

John Doe Publié le 19 février 2016

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

Pour aligner à droite l'image multimédia, ajoutez l'image après le .media-bodyconteneur :

Alignement en haut, au milieu ou en bas

Utilisez les utilitaires flexibles, les align-self-*classes pour placer l'objet multimédia en haut, au milieu ou en bas :

Haut des médias

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

---

Milieu des médias

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

---

Bas média

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.

La douleur elle-même est l'amour de la douleur, les principaux problèmes écologiques, mais je donne ce genre de temps pour tomber, de sorte que de grandes douleurs et douleurs.