因此，在深入探討這個(gè)問(wèn)題之前，我想指出一些簡(jiǎn)單的要求，即如果可能的話，我希望如何實(shí)現(xiàn)這一目標(biāo)。a) 因?yàn)槲艺谛薷氖褂?Bootstrap 3 的 Woocommerce 模板，所以我不能簡(jiǎn)單地切換到 Bootstrap 4，即使最新版本確實(shí)對(duì)我有很大幫助。b) 我可以使用任何技術(shù)或自定義代碼，只要它可以正常工作，即使它超出了 Bootstrap 3 框架范圍。所以這是小提琴： https: //jsfiddle.net/wL1kjc0y/我還想讓這個(gè)產(chǎn)品列表更有趣，例如，對(duì)于奇怪的項(xiàng)目，我想讓產(chǎn)品名稱、文本、按鈕浮動(dòng)到右側(cè)，以便產(chǎn)品圖像出現(xiàn)在左側(cè)，并且?guī)缀鯇?duì)于甚至項(xiàng)目也是如此 - 圖像浮動(dòng)到右側(cè)，文本內(nèi)容浮動(dòng)到左側(cè)。我為文本內(nèi)容創(chuàng)建了 div.col-lg-6 元素，為圖像創(chuàng)建了 col-lg-6 元素。問(wèn)題是，如果我將 .pull-right 類(lèi)應(yīng)用于包裝 Product 內(nèi)容的 div.col-lg-6 元素，則 .pull-right 類(lèi)不起作用。而且因?yàn)?Bootstrap 3 不使用 Flexbox，我添加了以下代碼：.d-flex {    display: flex !important; }到包裹兩列的元素，以便文本垂直居中正常工作。我發(fā)現(xiàn)浮動(dòng)：對(duì)；不適用于彈性元素。所以我不確定是否可以做我想做的事情，如果刪除 .d-flex 類(lèi)定義，一切都會(huì)正常，然后我可以使用 .pull-right 類(lèi)，但文本不會(huì)垂直居中。您可以看一下刪除 .d-flex 并將 .pull-right 類(lèi)應(yīng)用于第一項(xiàng)的示例，它按預(yù)期工作： https: //jsfiddle.net/7guxfa5o/1/所以最后看起來(lái)我有兩個(gè)不完整的選擇：讓需要向右浮動(dòng)但垂直居中不起作用的列，或者在無(wú)法浮動(dòng)列的情況下進(jìn)行垂直居中。您可以忽略那里的 JavaScript 部分，因?yàn)樗饕糜跈z測(cè)瀏覽器窗口大小是否為中等大小，然后應(yīng)用一些格式、樣式規(guī)則。任何可行的替代方法或任何我可以嘗試的建議都將非常感激。