如何将背景颜色更改为透明？

Question

我在 prestashop 中有 this website

并且我想将页眉的背景更改为透明。

滑块应该像本网站那样出现在页眉的背景中 https://demotheme.site/prestashop/at_nova_demo/en/home-7.html。我正在尝试在检查模式下执行此操作，但我无法执行此操作。

Answer 1

关注这个

-右键单击并检查元素 - 使用类似浏览器的 crome，然后单击图像中指示的图标 - 在 header 上，当焦点集中时单击它 - 在浏览器控制台的元素部分将指示元素和 class/id - 在 css 文件中找到 class/id 并且：

背景：透明；

Answer 2

您需要更改两个 css 属性以使 header 透明：

页面未向下滚动时：

#header.navbar-fixed-top {
   background: transparent;
}

当你滚动页面时，也需要改变这个:

#header.navbar-fixed-top.mini-navbar {
   background: rgba(255,255,255,0); /* <----here set the opacity to 0 */
  -moz-box-shadow: 0 5px 10px rgba(0,0,0,.1);
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.1);
  -o-box-shadow: 0 5px 10px rgba(0,0,0,.1);
  -ms-box-shadow: 0 5px 10px rgba(0,0,0,.1);
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
}

check here

要使滑块出现在 header 的背景中，您需要从 iviewSlider 元素中删除 margin-top：

.page-index .iviewSlider {
    margin-top: 0; /* here set margin-top to 0, if not working, try to set as margin-top: 0 !important */
}

那么您的网站将看起来像 this

Answer 3

使用此代码

header#header {
    background-color: transparent!important;
    box-shadow: none!important;
}

如何将背景颜色更改为透明？

How to change background color to transparent?

html

css

prestashop-1.7