我有這個：
<% if(data.length){
var i = 0;
while (i < data.length) { %>
<%for ( var j = 0; j < 4; j ) { %>
<div class="text-center">
<div class="col-lg-4">
<div class="card shadow mb-4">
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-primary"><%= data[i].NOTES %></h6>
</div>
<div class="card-body">
<div class="chart-pie pt-4">
<!-- <canvas id="myPieChart"> -->
<img src="https://images.unsplash.com/photo-1633113216120-53ca0a7be5bc?ixlib=rb-1.2.1&ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw=&auto=format&fit=crop&w=900&q=60" id="donutimage">
<!-- </canvas> -->
</div>
<hr>
Styling for the donut chart can be found in the <code>/js/demo/chart-pie-demo.js</code> file.
</div>
</div>
</div>
</div>
<% i ;
if (i >= data.length){
j = 4;
}
} %>
<% }
}else{ %>
<p>Unfortunately, no results were found. Please try again or contact an admin if you believe this is an erorr.</p>
<% } %>
它可以作業，它顯示資料庫的值，但是，我需要做的是將它們放入 4 行。現在，正在發生的事情是在將新文??件插入到db 正在它的正下方加載，而不是像一行一樣在它旁邊加載。我只是在使用bootstrap，我希望我可以添加一些自定義 css，但我不知道從哪里開始。我該怎么做？
uj5u.com熱心網友回復：
我不知道你剩下的代碼是什么，但是為了col作業，你需要把它row作為一個直接的孩子包裝起來。將您的代碼更改為：
<% if(data.length) {
var i = 0;
while (i < data.length) { %>
<div class="row">
<%for ( var j = 0; j < 4; j ) { %>
<div class="col-lg-3 text-center">
<div class="card shadow mb-4">
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-primary"><%= data[i].NOTES %></h6>
</div>
<div class="card-body">
<div class="chart-pie pt-4">
<!-- <canvas id="myPieChart"> -->
<img src="https://images.unsplash.com/photo-1633113216120-53ca0a7be5bc?ixlib=rb-1.2.1&ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw=&auto=format&fit=crop&w=900&q=60" id="donutimage">
<!-- </canvas> -->
</div>
<hr>
Styling for the donut chart can be found in the <code>/js/demo/chart-pie-demo.js</code> file.
</div>
</div>
</div>
<% i ;
if (i >= data.length){
j = 4;
}
} %>
</div>
<% }
} else { %>
<p>Unfortunately, no results were found. Please try again or contact an admin if you believe this is an erorr.</p>
<% } %>
uj5u.com熱心網友回復：
這就是你要找的東西。它將在每行中創建 4 張卡片，用于更大的螢屏及以上 -
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-lg-3 mb-4"> <- Get your loop start from here
HI
</div>
</div>
</div>
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/405469.html
標籤：