css - wordpress - 下拉菜单指示器
问题描述
我决定在 #COVID19 Lockdown 期间学习 wordpress。
在我的主菜单中,我为父母和孩子使用了下拉指示器。在指示箭头之后,出现另一个“方形”不受欢迎的字符。
我尝试编辑子主题中的 stlye.css 如下,
.main-navigation .menu-item-has-children a:after {display: none;}
这不能解决问题。
任何解决问题的帮助将不胜感激。
/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain: Avada
*/
.fusion-main-menu>ul>li>a{height: auto !important; padding: 25px 0;}
.fusion-header > .fusion-row{display: flex; align-items: center;}
.fusion-main-menu{margin-left: auto;}
.main-navigation .menu-item-has-children a::after,a::before {content: '';}
.fusion-main-menu .fusion-dropdown-menu .sub-menu li a{line-height: 1.55;}
.fusion-image-wrapper .fusion-rollover{background: rgba(110,50,118,0.9) !important;}
#newsLetterFormDiv{max-width: 500px; width: 100%; margin: 0 auto; text-align: center;}
#newsLetterFormDiv input[type="email"]{ background: #6d2761; display: block; margin-bottom: 15px; border: solid 1px #ab5d9d; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
#newsLetterFormDiv input[type="submit"]{ display: inline-block; width: auto; background: #4eb852; }
#newsLetterFormDiv input[type="submit"]:hover{opacity: 0.65;}
#gallery-1 .gallery-item{box-sizing: border-box; padding: 0 10px;}
.fusion-header > .fusion-row{display: flex; align-items: center;}
.fusion-header > .fusion-row > .fusion-main-menu{margin-right: auto; order: 1; margin-left: 0;}
.fusion-header > .fusion-row > .fusion-logo{margin-left: auto; order: 2;}
.tfs-slider .slide-content{ box-sizing: border-box; padding: 25px; background: #6e3276; }
.tfs-slider .slide-content h2.title-heading-center{font-size: 50px !important; line-height: 1.1 !important;}
.tfs-slider .slide-content h3.title-heading-center{font-size: 24px !important;}
.tfs-slider .slide-content-container{ width: auto; left: auto; right: 0; transform:none ; -webkit-transform:none ; -moz-transform:none ; -ms-transform:none ; -o-transform:none ; bottom: 0; padding: 0 !important; top: auto !important; }
#eduPhilosophyBox .flip-box-inner-wrapper{min-height: 350px !important;}
#philoRow .fusion-image-carousel{margin-bottom: 0;}
#philoRow .fusion-carousel-wrapper{padding: 0; margin: 0;}
#ourProgramsRowSection .fusion-title.fusion-title-center{margin-bottom: 0;}
#ourProgramsRow > .fusion-row{max-width: 1020px !important;}
#recentPostColum .fusion-title{margin-bottom: 0 !important;}
#recentPostColum .fusion-recent-posts{margin-bottom: 0 !important;}
#homeEventListing .fusion-events-post{margin-bottom: 0 !important;}
#homeEventListing .fusion-events-meta h2{font-size: 19px !important; text-transform: none;}
#homeGalList{list-style: none; margin:0; padding: 0; margin-bottom: 20px; overflow: hidden; }
#homeGalList > li{width: 50%; box-sizing: border-box; padding: 5px; float: left;}
#homeGalList > li:nth-child(2), #homeGalList > li:nth-child(3){padding: 5px 10px;}
#homeGalList > li >a{position: relative; display: block; overflow: hidden;}
#homeGalList > li >a img{ display: block; width: 100%; transition:all ease 0.2s ; -webkit-transition:all ease 0.2s ; -moz-transition:all ease 0.2s ; -ms-transition:all ease 0.2s ; -o-transition:all ease 0.2s ; }
#homeGalList > li >a h4{background: #6e3276; color: #fff; margin: 0; line-height: 1.1; padding: 10px; box-sizing: border-box; position: absolute; left: 0; bottom: 0; width: 100%; }
#homeGalList > li >a:hover img{ transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; }
.hmteaseBlock > .fusion-column-wrapper{opacity: 0; position: relative; z-index: 2;}
.hmteaseBlock:hover > .fusion-column-wrapper{opacity: 1;}
.hmteaseBlock > .fusion-column-inner-bg{ z-index: 1;}
.hmteaseBlock > .fusion-column-inner-bg a > span:before{ content: ""; display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.5); opacity: 0; transition:all ease 0.3s ; -webkit-transition:all ease 0.3s ; -moz-transition:all ease 0.3s ; -ms-transition:all ease 0.3s ; -o-transition:all ease 0.3s ; }
.hmteaseBlock:hover > .fusion-column-inner-bg a > span:before{opacity: 1;}
.fusion-page-title-bar{position: relative;}
.fusion-page-title-bar:after{content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background:rgba(0, 0, 0, 0.5); z-index: 1; }
.fusion-page-title-bar .fusion-page-title-row{position: relative; z-index: 2;}
.founderText{color: #fff;}
.peadalogyLadContentBox .content-container{box-sizing: border-box; padding: 15px; }
#aboutLAcontBox .content-box-column{ margin-top: 90px;}
#menu-program > li{border: 0 !important;}
#menu-program > li > a{box-sizing: border-box; padding:5px 10px; background:#4eb852; color: #fff; font-weight: bold; display: block; }
#menu-program > li > a:before, #menu-program > li > a:after{display: none;}
#menu-program > li > .sub-menu > li:last-child{border: 0 !important;}
解决方案
尝试使用浏览器的开发人员工具检查该元素。它应该向您显示正在应用于元素的样式以及它们的来源。
在 WordPress 的许多情况下,有一个插件在主样式表之后添加样式,因此覆盖它们,或者通过 JavaScript 添加内联样式。
推荐阅读
- docker - docker-compose之后的网络与定义的名称不同?
- javascript - 所有对象的 Javascript 警报
- pandas - 名称“_Unspecified”未定义
- javascript - javascript:将对象添加到数组会更改对象属性
- mql5 - 我该如何解决这个问题:“'Price.mqh' (57,12) 中的数组超出范围”?
- python - 如何按字母顺序返回文本文件中的所有单词(每个单词一次)?
- ruby-on-rails - 如何使用正则表达式从日期字符串中提取日期
- java - 无法使用 Android Studio 在 Phpmyadmin 中保存数据
- java-native-interface - JNI如何使用多文件java生成头文件(.h)
- uwp - 如何检查用户是否在设置中授予文件系统权限?