0

参考:http : //meraxcapital.weebly.com/

我正在尝试为客户端停止粘性标题,但它让我发疯,这是基本的标题 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;
  }

我已经尝试了所有 ~logical~ 方法,但欢迎提出任何建议。

我也遇到了一些试图放大徽标的冲突(与上面的代码相同)

我曾尝试更改“最大宽度/高度”元素,虽然它可以在检查元素中使用,但在实际实现时却没有!

非常感谢您提前!

4

2 回答 2

0

目标是禁用“固定”位置并将其更改为绝对位置。如果您可以访问样式,那么我会直接将它们从固定更改为绝对。如果没有,那么您可以尝试使用以下内容覆盖现有内容:

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

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

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

body.page-has-banner .logo img {
     max-height: 70px;
     max-width: 250px;
}
于 2015-10-05T22:34:37.320 回答
0

如果我理解正确,您想阻止标题被固定到网页顶部,您将必须删除以下内容:

.birdseye-header {
  position: fixed;
}

此外,您应该删除高度 - 这是如何为标题增加高度的方式 - 我认为它在您的 main_style.css 行/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; 
}

于 2015-10-05T23:04:26.700 回答