grille de bloc Fondation
grille Massive pour le partage de contenu de la page: par exemple, une ligne pour afficher quatre images, peu importe ce que la largeur moyenne de l'écran est nécessaire.
Vous pouvez utiliser le <ul> élément , plus .small|medium|large-block-grid- num d' .small|medium|large-block-grid- num grille- num classe pour créer la grille massif. num est le numéro utilisé pour spécifier la moyenne:
Exemples
<Class Ul = "small block -grid-3">
<Li> <img src = " newyork.jpg" alt = "New York"> </ li>
<Li> <img src = " paris.jpg" alt = "Paris"> </ li>
<Li> <img src = " sanfran.jpg" alt = "San Francisco"> </ li>
</ Ul>
<Li> <img src = " newyork.jpg" alt = "New York"> </ li>
<Li> <img src = " paris.jpg" alt = "Paris"> </ li>
<Li> <img src = " sanfran.jpg" alt = "San Francisco"> </ li>
</ Ul>
Essayez »
Un autre exemple, utiliser le paragraphe:
Exemples
<Class Ul = "small block -grid-3">
<Li> <p> Juste un exemple simple texte ... </ p> </ li>
<Li> <p> Juste un exemple simple texte ... </ p> </ li>
<Li> <p> Juste un exemple simple texte ... </ p> </ li>
</ Ul>
<Li> <p> Juste un exemple simple texte ... </ p> </ li>
<Li> <p> Juste un exemple simple texte ... </ p> </ li>
<Li> <p> Juste un exemple simple texte ... </ p> </ li>
</ Ul>
Essayez »
Afficher un nombre différent de différentes tailles
En ajoutant plusieurs blocs de grille de différentes classes de taille peut être réglée pour afficher un nombre différent de blocs:
Exemples
<Ul class = "small block -grid-2 moyen-bloc-grille-3 grand-bloc-grille-4">
<Li> <img src = " newyork.jpg" alt = "New York"> </ li>
<Li> <img src = " paris.jpg" alt = "Paris"> </ li>
<Li> <img src = " sanfran.jpg" alt = "San Francisco"> </ li>
<Li> <img src = " newyork.jpg" alt = "New York"> </ li>
</ Ul>
<Li> <img src = " newyork.jpg" alt = "New York"> </ li>
<Li> <img src = " paris.jpg" alt = "Paris"> </ li>
<Li> <img src = " sanfran.jpg" alt = "San Francisco"> </ li>
<Li> <img src = " newyork.jpg" alt = "New York"> </ li>
</ Ul>
Essayez »