Html 如何为eshop一行显示3个以上的图像
我下载了一个代码来练习制作电子商店，我想显示4个产品，而不是每行显示3个产品。我尝试了不同的方法，但都失败了。我还试图删除一些行，看看是否有什么变化，但我没有得到我想要的结果。如果有人能帮忙，我会非常感激。这是密码Html 如何为eshop一行显示3个以上的图像,html,web,bootstrap-4,frontend,Html,Web,Bootstrap 4,Frontend,我下载了一个代码来练习制作电子商店，我想显示4个产品，而不是每行显示3个产品。我尝试了不同的方法，但都失败了。我还试图删除一些行，看看是否有什么变化，但我没有得到我想要的结果。如果有人能帮忙，我会非常感激。这是密码 <section class="product-shop spad"> <div class="container"> <div class="row&qu
<section class="product-shop spad">
<div class="container">
<div class="row">
<div class="product-list">
<div class="row">
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-1.jpg" alt="">
<div class="sale pp-sale">Sale</div>
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Towel</div>
<a href="#">
<h5>Pure Pineapple</h5>
</a>
<div class="product-price">
$14.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-2.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Coat</div>
<a href="#">
<h5>Guangzhou sweater</h5>
</a>
<div class="product-price">
$13.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-3.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Shoes</div>
<a href="#">
<h5>Guangzhou sweater</h5>
</a>
<div class="product-price">
$34.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-4.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Coat</div>
<a href="#">
<h5>Microfiber Wool Scarf</h5>
</a>
<div class="product-price">
$64.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-5.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Shoes</div>
<a href="#">
<h5>Men's Painted Hat</h5>
</a>
<div class="product-price">
$44.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-6.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Shoes</div>
<a href="#">
<h5>Converse Shoes</h5>
</a>
<div class="product-price">
$34.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-7.jpg" alt="">
<div class="sale pp-sale">Sale</div>
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Towel</div>
<a href="#">
<h5>Pure Pineapple</h5>
</a>
<div class="product-price">
$64.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-8.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Coat</div>
<a href="#">
<h5>2 Layer Windbreaker</h5>
</a>
<div class="product-price">
$44.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6">
<div class="product-item">
<div class="pi-pic">
<img src="img/products/product-9.jpg" alt="">
<div class="icon">
<i class="icon_heart_alt"></i>
</div>
<ul>
<li class="w-icon active"><a href="#"><i class="icon_bag_alt"></i></a></li>
<li class="quick-view"><a href="#">+ Quick View</a></li>
<li class="w-icon"><a href="#"><i class="fa fa-random"></i></a></li>
</ul>
</div>
<div class="pi-text">
<div class="catagory-name">Shoes</div>
<a href="#">
<h5>Converse Shoes</h5>
</a>
<div class="product-price">
$34.00
<span>$35.00</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
特价
毛巾
$14.00
$35.00
外套
$13.00
$35.00
鞋
$34.00
$35.00
外套
$64.00
$35.00
鞋
$44.00
$35.00
<div class="col"> ****your content**** </div>
<div class="row"> ****your group of columns**** </div>
<div class="container"> ****your row with columns inside it**** </div>