如何定位相关文件以添加css background-image并将其保存到div标签

Question

我正在尝试将一个背景图片添加到div标签中，该标签位于一个joomla自定义html模块中，负责t3 mega菜单中的下拉菜单。 使用firefox开发人员工具找到div标签。

div class =“nav-child dropdown-menu mega-dropdown-menu”

想要改为：

div class =“nav-child下拉菜单mega-dropdown-menu  style =“background-image：url（'/ images / headers / button_background.png'）”

但我找不到关联的文件来保存对远程主机的更改。 请帮忙。

Answer 1

在此位置从Bootstrap.css进行任何更改制作备份副本之前：

  

/components/com_eshop/assets/bootstrap/css/bootstrap.css

您可以通过编辑 Bootstrap.css 文件来完成此操作，首先将图像'button_background.png'复制到同一文件夹（Bootstrap.css所在的位置）。然后打开Bootstrap.css文件，并添加以下样式：

.mega-dropdown-menu {
    background-image: url(button_background.png) !important  /*only image name this case*/
}

Answer 2

不是直接编辑文件（并且在更新Joomla或第三方扩展时丢失更改），而是使用CSS覆盖实现此更改可能更好。

看起来您正在使用T3模板，因此add a custom.css file in the template CSS folder使用以下代码或类似代码：

.nav-child.dropdown-menu.mega-dropdown-menu {
  background-image: url('/images/headers/button_background.png');
}