如何更改css以顯示移動模式下的兩種產品？

如何更改css在移動模式下顯示兩個產品？我的網站是用wordpress CMS設計的，主題是aloshop，我使用7up主題插件來展示暢銷產品以及最新和最受歡迎的產品。但何時是移動模式，每列只顯示一種產品，我可以將其更改爲在移動模式下顯示每列兩種產品？如何更改css以顯示移動模式下的兩種產品？

我的網站URL - >URL

我想下面的CSS：

@media(max-width:960px){ 
 
.tab-content { 
 
    width:50%; 
 
    float:left; 
 
    } 
 
    }

來源

2017-10-14 mostafa

您想要將2款產品並排顯示在主頁的哪一部分？該頁面上有幾個產品部分。 –

自動幻燈片下有4種產品 \t 但是在移動模式下，每列僅顯示其中一種。 – mostafa

更改您的js這樣

var owl = $("#owl-demo"); 

owl.owlCarousel({ 
    items : 10, //10 items above 1000px browser width 
    itemsDesktop : [1000,4], //4 items between 1000px and 901px 
    itemsDesktopSmall : [900,3], // betweem 900px and 601px 
    itemsTablet: [600,2], //2 items between 600 and 0 
    itemsMobile : false // itemsMobile disabled - inherit from itemsTablet option 
});

參考：http://www.landmarkmlp.com/js-plugin/owl.carousel/demos/custom.html

來源

2017-10-14 06:57:33 Znaneswar

我確定CSS存在問題。該部分使用的插件是7UP-sv產品選項卡。 – mostafa

好吧，不用擔心我在你的源代碼中看到了'owl.carousel'，並且使用那裏的滑塊有'owl'滑塊，所以我在想它的效果'owl-slider' – Znaneswar

如何更改css以顯示移動模式下的兩種產品？

回答

相關問題