<s id="ux55u"><sub id="ux55u"></sub></s><thead id="ux55u"><legend id="ux55u"><sup id="ux55u"></sup></legend></thead>

    1. <strike id="ux55u"><u id="ux55u"><xmp id="ux55u"><dd id="ux55u"></dd>

      最新產品區塊中產品名稱和價格如何居中顯示

      2017-02-08 13:17:00
      GavinHsueh
      原創
      3584

      之前我們一起討論過如何調整產品列表頁面的產品名稱和價格居中顯示,傳送門—> http://www.animar-records.com/jianzhan/168.html

      企業用戶經常會在網站首頁添加一個最新產品區塊,使用戶最便捷地了解公司的最新產品信息。所以這篇文章我們一起了解一下,如何設置最新產品區塊中產品名稱和價格居中顯示。

      首先我們新建一個最新產品區塊,并布局到網站首頁。默認顯示效果如下:

      接下來,我們在該區塊的CSS項里添加如下代碼,以達到我們預期的效果:


      #blockID .card-heading{
          text-align:center;
      }
      #blockID .card-heading span{
          float:none !important;
      }

      效果如下:


      如果想使產品名稱和價格各占一行,可以用下面代碼:


      #blockID .card-heading{
          text-align:center;
      }
      #blockID .card-heading span{
          float:none !important;
          display:block;
          width:100% !important;
      }

      效果如下:


      如果在這里不想顯示價格,可以用下面代碼:


      #blockID .card-heading{
          text-align:center;
      }
      #blockID .card-heading span{
          float:none !important;
      }
      #blockID .card-heading span:last-child{
          display:none;
      }
      效果如下:


      聯系我們

      聯系人:ZSITE交流群

      電話/微信:

      Email:

      QQ:

      地址:青島市黃島區井岡山路157號中南金石國際廣場A座3205室

      无遮挡H肉动漫视频在线观看
        <s id="ux55u"><sub id="ux55u"></sub></s><thead id="ux55u"><legend id="ux55u"><sup id="ux55u"></sup></legend></thead>

      1. <strike id="ux55u"><u id="ux55u"><xmp id="ux55u"><dd id="ux55u"></dd>