Magento 2 - 分层导航样本样式答案

【问题标题】：Magento 2 - Layered Navigation Swatches StylingMagento 2 - 分层导航样本样式
【发布时间】：2022-11-20 02:48:31
【问题描述】：

我正在使用 Magento 2.4.5 并想在分层导航中编辑图标的 css，需要它们更小并将它们放在 6 行中。

我找不到需要为网站的这一部分添加/编辑 css 文件的位置。我试过 Magento_Swatches\web\css\source_module.less 但没有结果。

任何帮助，将不胜感激。

谢谢

【问题讨论】：

标签： magento2

【解决方案1】：

如果您使用默认的 Luma 主题：

笔记：首先，您需要检查使用的 CSS 源的模板文件。

您需要编辑 CSS 文件：色板.css或自定义 CSS（如果您已创建）。获得正确的元素可能会给你一个正确的捕获。

你能调整样本div的宽度和高度吗？请记得注明！ CSS 中的一个重要规则。

    .swatches-globo .swatch--gl .ul-swatches-list li:not(ul.ul-globo-dropdown-option li), .globo-swatch-product-detail .swatch--gl ul.value li:not(ul.ul-globo-dropdown-option li) {
    display: block;
    float: left;
    margin: 0 10px 10px 0!important;
}

还，

 .swatches-globol .swatch--gl li .globo-size-medium, .globo-swatch-product-detail .globo-detail-size-medium {
    width: 35px;
    height: 35px;
}

谢谢

【讨论】：