Bootstrap List Grid by @AnthonyK - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

<strong>Definisce una parte del testo importante con formattazione in grassetto.
mediaSpecifica a quale dispositivo/display/documento è ottimizzata una risorsa.
nameDetermina il nome degli elementi HTML o fornisce dati su un attributo associato.
<tbody>Definisce il contenuto principale di una tabella.
rowspanDefinisce il numero di righe su cui una cella di una tabella deve estendersi.
minImposta il valore numerico o temporale minimo per un elemento input

Users

Log in to search for users

Explore

Find inspiration

Thomas Fattori 1

\\\"Il Razzismo - Un Tema Importa

Heads Or Tails Random Tally

TechForge | Riparazioni e Stampa 3D

round - social bar

Mundane Monday\'s or Fantasic Frid

DEMO: For Loop 2

Titolo della pagina

Il Riflesso di Adrian Vale

esercitazione4.html(2)

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Bootstrap List Grid</title>
  <!-- Include Bootstrap CSS -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
  <link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>

  <div class="container mt-5">
    <div class="row">
      <!-- List Item 1 -->
      <div class="col-md-4 mb-4">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Array: Length</h5>
            <p class="card-text">This is the description for item 1. You can add more details here.</p>
          </div>
        </div>
      </div>

      <!-- List Item 2 -->
      <div class="col-md-4 mb-4">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Array: For-Loop</h5>
            <p class="card-text">This is the description for item 2. Add more information as needed.</p>
          </div>
        </div>
      </div>

      <!-- List Item 3 -->
      <div class="col-md-4 mb-4">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Array: For-Each</h5>
            <p class="card-text">Here is the description for item 3. You can modify this as required.</p>
          </div>
        </div>
      </div>

      <!-- List Item 4 -->
      <div class="col-md-4 mb-4">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Array: For-In</h5>
            <p class="card-text">Here is the description for item 5. You can add more text here.</p>
          </div>
        </div>
      </div>


      <!-- List Item 5 -->
      <div class="col-md-4 mb-4">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Array: Concat</h5>
            <p class="card-text">
              <p class="card-text">Here is the description for item 5. You can add more text here.</p>
            </p>
          </div>
        </div>
      </div>

      <!-- List Item 6 -->
      <div class="col-md-4 mb-4">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Array: Join</h5>
            <p class="card-text">
              <p class="card-text">Here is the description for item 6. You can add more text here.</p>
            </p>
          </div>
        </div>
      </div>


  <!-- Include Bootstrap JS (optional) -->
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
  <script src="script.js"></script>
</body>
</html>

html {
  height: 100%;
  width: 100%;
}

var context = document.querySelectorAll("p.card-text");

var artistNames;
var artistLength;

// 1
function displayArtistLength() {
  var artists =["Dj Pelzer ", "PrinceFlacco ", "Pl Da P ", "Icejjfish "," Playboi Carti"]; 
  context[0].innerText = artists;
  context[0].innerText = artists.length;

}
displayArtistLength();

// 2
function displayArtistForLoop() {
   
  let text = "";
  for (let i = 0; i < artist.length; i++) {
    text += artists[i] + "<br>";
  }

  }
  displayArtistForLoop();





// 3
function displayArtistForEach() {


}
displayArtistForEach();


// 4
function displayArtistForIn() {


}
displayArtistForIn();


// 5
function displayArtistConcat() {


}
displayArtistConcat();



// 6
function displayArtistJoin() {




}
displayArtistJoin();