Différences entre les versions de « Using grids »

De Test Entre Amis
Aller à : navigation, rechercher
Ligne 1 : Ligne 1 :
 
<div class="container-fluid mb-4">
 
<div class="container-fluid mb-4">
<div class="row">
+
    <div class="row">
    <div class="col-12 col-lg-6 col-xl-4 mb-2 mb-lg-4 mb-xl-0">
+
        <div class="col-12 col-lg-6 col-xl-4 mb-2 mb-lg-4 mb-xl-0">
        <div class="card">
+
            <div class="card">
            <div class="card-body">
+
                <div class="card-body">
                <h5 class="card-title">Title 1</h5>
+
                    <h5 class="card-title">Title 1</h5>
                [[File:Screenshot tweeki.png|class=img-fluid| link=]]
+
                    [[File:Screenshot tweeki.png|class=img-fluid| link=]]
 +
                </div>
 +
                <div class="card-footer">Footer text 1</div>
 
             </div>
 
             </div>
             <div class="card-footer">Footer text 1</div>
+
             <!-- End of card -->
 
         </div>
 
         </div>
         <!-- End of card -->
+
         <!-- end of col 1-->
    </div>
+
        <div class="col-12 col-lg-6 col-xl-4 mb-2 mb-lg-4 mb-xl-0">
    <!-- end of col 1-->
+
            <div class="card">
    <div class="col-12 col-lg-6 col-xl-4 mb-2 mb-lg-4 mb-xl-0">
+
                <div class="card-body">
        <div class="card">
+
                    <h5 class="card-title">Title 2</h5>
            <div class="card-body">
+
                    [[File:Screenshot tweeki.png|class=img-fluid| link=]]
                <h5 class="card-title">Title 2</h5>
+
                </div>
                [[File:Screenshot tweeki.png|class=img-fluid| link=]]
+
                <div class="card-footer">Footer text 2</div>
 
             </div>
 
             </div>
             <div class="card-footer">Footer text 2</div>
+
             <!-- End of card -->
 
         </div>
 
         </div>
         <!-- End of card -->
+
         <!-- End of col 2-->
    </div>
+
        <div class="col-12 col-lg-6 col-xl-4">
    <!-- End of col 2-->
+
            <div class="card">
    <div class="col-12 col-lg-6 col-xl-4">
+
                <div class="card-body">
        <div class="card">
+
                    <h5 class="card-title">Title 3</h5>
            <div class="card-body">
+
                    [[File:Screenshot tweeki.png|class=img-fluid| link=]]
                <h5 class="card-title">Title 3</h5>
+
                </div>
                [[File:Screenshot tweeki.png|class=img-fluid| link=]]
+
                <div class="card-footer">Footer text 3</div>
 
             </div>
 
             </div>
             <div class="card-footer">Footer text 3</div>
+
             <!-- End of card -->
 
         </div>
 
         </div>
         <!-- End of card -->
+
         <!-- End of col 3-->
 
     </div>
 
     </div>
     <!-- End of col 3-->
+
     <!-- End of row 1-->
</div>
 
 
</div>
 
</div>
<!-- End of row 1-->
 

Version du 12 janvier 2023 à 18:43

Title 1
                   Screenshot tweeki.png
Title 2
                   Screenshot tweeki.png
Title 3
                   Screenshot tweeki.png