在 birdseye weebly 主题上停止修复 header 并使徽标变大

Question

参照：http://meraxcapital.weebly.com/

我正在尝试为一个客户停止粘性 header 的弱主题，但它让我抓狂这里是基本的 header css 代码：

/* Header */
.birdseye-header {
  position: fixed;
  z-index: 12;
  overflow-y: hidden;
  width: 100%;
  padding: 10px 30px;
  box-sizing: border-box;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  -ms-transition: all 250ms ease;
  -o-transition: all 250ms ease;
  transition: all 250ms ease;
}
 .birdseye-header .container {
  display: table;
  overflow-y: hidden;
  width: 100%;
  max-height: 80px;
}
 .birdseye-header label.hamburger {
  display: none;
}
.birdseye-header .logo {
 display: table-cell;
 overflow-y: hidden;
 margin-right: 30px;
 padding: 0;
 vertical-align: middle;
 line-height: normal;
}
.birdseye-header .logo a {
 display: block;
  margin-right: 30px;
  margin-left: 10px;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-family: 'Open Sans', sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: normal;
 }
 .birdseye-header .logo img {
  display: block;
  overflow: hidden;
  max-width: 200px;
  max-height: 40px;
}
.birdseye-header .logo #wsite-title {
  display: block;
  max-width: 400px;
  max-height: 40px;
  font-family: 'Open Sans', sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: normal;
  }

我已经尝试了所有~合乎逻辑~的方法，但欢迎提出任何建议。

我在尝试放大徽标时也遇到了一些冲突（与上面的代码相同）

我曾尝试更改 'max-width / height 元素，虽然它在 inspect 元素中起作用，但在实际实施时却没有！

在此先感谢您！

Answer 1

目标是禁用 "fixed" 位置并将其更改为绝对位置。如果您有权访问样式，那么我会直接将它们从固定更改为绝对。如果没有，那么您可以尝试使用以下内容覆盖其中的内容：

.birdseye-header, body.page-has-banner.affix .birdseye-header, body.splash-page.affix .birdseye-header {
    position: absolute !important;
}

至于图像大小...您需要禁用或更改“.birdseye-header .logo img”选择器的最大宽度和最大高度。

您可以尝试使用以下内容覆盖它们：

body.page-has-banner .logo img {
     max-height: 70px;
     max-width: 250px;
}

Answer 2

如果我理解正确，您想阻止 header 固定在网页顶部，您必须删除以下内容：

.birdseye-header {
  position: fixed;
}

你还应该删除高度 - 这一些如何增加高度到 header - 我认为它在你的 main_style.css line/30:

body.page-has-banner.affix .birdseye-header, body.splash-page.affix .birdseye-header { 
  position: fixed; 
  top: 0; 
  background: rgba(35, 35, 35, 0.95); 
  /* height: 60px; */
  padding: 10px 30px; 
}

在 birdseye weebly 主题上停止修复 header 并使徽标变大

Stop Fixed header on birdseye weebly theme and make logo larger

html

css

header

weebly