以垂直模式显示Woocommerce可变产品的色样

Question

我有一家Woocommerce商店，上面有一些带有色标的可变产品。

如何显示垂直形式而不是水平形式。我试图编辑它们，但是没有成功。

<div class="attribute-swatch" attribute-index="">
    <div class="swatchinput">
        <label selectid="colours-available" class="attribute_colours-available_White wcvaswatchlabel wcvasquare" data-option="White" selectedtext="White" style="background-color:#ffffff; width:32px; height:32px; "></label>
    </div>
    <div class="swatchinput">
        <label selectid="colours-available" class="attribute_colours-available_Anthracite grey ANTRA24 wcvaswatchlabel wcvasquare" data-option="Anthracite grey ANTRA24" selectedtext="Anthracite grey ANTRA24" style="background-color:#3a3b45; width:32px; height:32px; "></label>
    </div>
    <div class="swatchinput">
        <label selectid="colours-available" class="attribute_colours-available_Brown RAL 8017 wcvaswatchlabel wcvasquare" data-option="Brown RAL 8017" selectedtext="Brown RAL 8017" style="background-color:#41221d; width:32px; height:32px; "></label>
    </div>
</div>

Answer 1

如果问题中的html代码是色样的生成代码，则可以尝试在活动主题的SymfonyBundle-php/Controller/Controller.php文件中添加以下CSS规则：

styles.css

应该可以。但是，如果为您的色样生成的代码不同，它将无法正常工作……