修改WordPress中父母和孩子的图标

奥尼修斯

我想修改wordpress网站上的图标。我有一个产品类别列表。也有子类别。

屏幕截图

我想为父类别放置一个图标,为子类别放置一个不同的图标。这样做:

.widget_product_categories ul li:之前{content:“ \ f7ab”; }

我更改了所有图标,但不知道如何分别更改父级和子级。

我不知道如何在CSS中做到这一点。你可以帮帮我吗 ?感谢您抽出宝贵的时间回答。

ul.product-categories {
}
.widget_archive ul, .widget_categories ul, .widget_layered_nav_filters ul, .widget_layered_nav ul, .widget_links ul, .widget_nav_menu ul, .widget_pages ul, .widget_product_categories ul, .widget_recent_comments ul, .widget_recent_entries ul {
    margin: 0;
}
.widget_archive ul, .widget_categories ul, .widget_layered_nav_filters ul, .widget_layered_nav ul, .widget_links ul, .widget_nav_menu ul, .widget_pages ul, .widget_product_categories ul, .widget_recent_comments ul, .widget_recent_entries ul {
    margin: 0;
}
.widget ul {
    margin-left: 0;
    list-style: none;
}
.widget_archive ul, .widget_categories ul, .widget_layered_nav_filters ul, .widget_layered_nav ul, .widget_links ul, .widget_nav_menu ul, .widget_pages ul, .widget_product_categories ul, .widget_recent_comments ul, .widget_recent_entries ul {
    margin: 0;
}
.widget ul {
    margin-left: 0;
    list-style: none;
}
ul {
    list-style: disc;
}
ol, ul {
    margin: 0 0 1.41575em 3em;
    padding: 0;
}
ul {
    list-style: disc;
}
ol, ul {
    margin: 0 0 1.41575em 3em;
    padding: 0;
}
* {
    box-sizing: border-box;
}
* {
    box-sizing: border-box;
}
user agent stylesheet
ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}
.widget-area .widget {
    font-size: .875em;
    font-weight: 400;
}
.widget-area .widget {
    font-size: .875em;
    font-weight: 400;
}
.header-widget-region, .site-content {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.header-widget-region, .site-content {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
body, .secondary-navigation a {
    color: #0d25ad;
}
body, button, input, select, textarea {
    font-family: Source Sans Pro,HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;
}
body, button, input, textarea {
    color: #43454b;
    line-height: 1.618;
    text-rendering: optimizeLegibility;
    font-weight: 400;
}
body {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}
body, button, input, select, textarea {
    font-family: Source Sans Pro,HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;
}
body, button, input, textarea {
    color: #43454b;
    line-height: 1.618;
    text-rendering: optimizeLegibility;
    font-weight: 400;
}
body {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}
:root {
    --wp-admin-theme-color: #007cba;
    --wp-admin-theme-color-darker-10: #006ba1;
    --wp-admin-theme-color-darker-20: #005a87;
}
:root {
    --wp-admin-theme-color: #007cba;
    --wp-admin-theme-color-darker-10: #006ba1;
    --wp-admin-theme-color-darker-20: #005a87;
}
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
<ul class="product-categories" wfd-id="31"><li class="cat-item cat-item-20 cat-parent" wfd-id="53"><a href="https://www.naturalriders.fr/categorie/le-cavalier/">Le Cavalier</a><ul class="children" wfd-id="54">
<li class="cat-item cat-item-39" wfd-id="58"><a href="https://www.naturalriders.fr/categorie/le-cavalier/accessoires/">Accessoires</a></li>
<li class="cat-item cat-item-36" wfd-id="57"><a href="https://www.naturalriders.fr/categorie/le-cavalier/bracelets/">Bracelets</a></li>
<li class="cat-item cat-item-37" wfd-id="56"><a href="https://www.naturalriders.fr/categorie/le-cavalier/ceintures/">Ceintures</a></li>
<li class="cat-item cat-item-38" wfd-id="55"><a href="https://www.naturalriders.fr/categorie/le-cavalier/tours-de-chapeaux/">Tours de chapeaux</a></li>
</ul>

亚历山德鲁·伯卡(Alexandru Burca)

要将它们分开使用,请.widget_product_categories ul li:before { content: "\f7ab"; }为父母和.widget_product_categories ul li ul li:before { content: ""}孩子使用。

顺便说一句,您的HTML代码错误。应该再有</li>一个</ul>标签。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类常见问题

在父母和孩子的表Laravel中插入行

来自分类Dev

Java中的树实现(根,父母和孩子)

来自分类Dev

父母和孩子中的点击事件

来自分类Dev

SQL查询选择孩子和父母

来自分类Dev

在自参考表中查询父母和孩子

来自分类Dev

MySQL从表中选择父母和孩子

来自分类Dev

根据父母集合中的孩子计算的财产

来自分类Dev

修改孩子的原型会影响父母的原型吗?

来自分类Dev

CQ模板中的“允许的父母和允许的孩子”属性

来自分类Dev

获取特定孩子的父母和祖父母

来自分类Dev

让孩子和父母的父母一样宽

来自分类Dev

在SwiftUI中从孩子的孩子调用父母的函数

来自分类Dev

苗条:在父母和孩子之间转移道具

来自分类Dev

Laravel,由父母和孩子获得结果

来自分类Dev

在父母和孩子的表Laravel中插入行

来自分类Dev

当父母和孩子都执行exec()时等待孩子

来自分类Dev

我如何使用班级的父母和孩子?

来自分类Dev

如何在O(1)查询中同时过滤父母和孩子?

来自分类Dev

父母和孩子的订单查询

来自分类Dev

Java-编辑父母名单中的孩子

来自分类Dev

让孩子修改其父母

来自分类Dev

如何从位置获取父母和孩子的ID

来自分类Dev

在递归SQL中为父母和孩子指定一个细分

来自分类Dev

sql,从一张表中获取父母和孩子

来自分类Dev

MySQL按父母和孩子排序

来自分类Dev

你如何在laravel eloquent中查询孩子和父母

来自分类Dev

你如何在laravel eloquent中查询孩子和父母

来自分类Dev

Caliburn.micro 父母->孩子和孩子->父母互动

来自分类Dev

结合父母名单和孩子名单

Related 相关文章

热门标签

归档