Différences entre les versions de « Using grids »

De Test Entre Amis
Aller à : navigation, rechercher
 
(5 versions intermédiaires par le même utilisateur non affichées)
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>
 
        <!-- End of card -->
 
    </div>
 
    <!-- end of col 1-->
 
    <div class="col-12 col-lg-6 col-xl-4 mb-2 mb-lg-4 mb-xl-0">
 
        <div class="card">
 
            <div class="card-body">
 
                <h5 class="card-title">Title 2</h5>
 
                [[File:Screenshot tweeki.png|class=img-fluid| link=]]
 
            </div>
 
            <div class="card-footer">Footer text 2</div>
 
        </div>
 
        <!-- End of card -->
 
    </div>
 
    <!-- End of col 2-->
 
    <div class="col-12 col-lg-6 col-xl-4">
 
        <div class="card">
 
            <div class="card-body">
 
                <h5 class="card-title">Title 3</h5>
 
                [[File:Screenshot tweeki.png|class=img-fluid| link=]]
 
            </div>
 
            <div class="card-footer">Footer text 3</div>
 
        </div>
 
        <!-- End of card -->
 
    </div>
 
    <!-- End of col 3-->
 
 
</div>
 
</div>
 +
<div class="card-footer">Footer text 1</div>
 +
</div><!-- End of card -->
 +
</div><!-- end of col 1-->
 +
 +
<div class="col-12 col-lg-6 col-xl-4 mb-2 mb-lg-4 mb-xl-0">
 +
<div class="card">
 +
<div class="card-body">
 +
<h5 class="card-title">Title 2</h5>
 +
[[File:Screenshot tweeki.png|class=img-fluid| link=]] 
 +
</div>
 +
<div class="card-footer">Footer text 2</div>
 +
</div><!-- End of card -->
 +
</div><!-- End of col 2-->
 +
 +
<div class="col-12 col-lg-6 col-xl-4">
 +
<div class="card">
 +
<div class="card-body">
 +
<h5 class="card-title">Title 3</h5>
 +
[[File:Screenshot tweeki.png|class=img-fluid| link=]]
 +
</div>
 +
<div class="card-footer">Footer text 3</div>
 +
</div><!-- End of card -->
 +
</div><!-- End of col 3-->
 +
 +
</div><!-- End of row 1-->
 +
</div>
 +
 +
----
 +
 +
<div class="panel-group" id="accordion">
 +
<accordion parent="accordion" heading="SECTION1" class="show">
 +
  Lorem ipsum...
 +
</accordion>
 +
<accordion parent="accordion" heading="SECTION2">
 +
  Lorem ipsum...
 +
</accordion>
 
</div>
 
</div>
<!-- End of row 1-->
 

Version actuelle datée du 1 février 2023 à 17:35

Title 1

Screenshot tweeki.png

Title 2

Screenshot tweeki.png

Title 3

Screenshot tweeki.png


  Lorem ipsum...

  Lorem ipsum...