Question

我正在为一家企业建立一个名为“photodeck”的建筑工地。

问题在于，构建器不允许我在菜单和徽标后面创建背景，所以我必须通过编辑主题CSS和HTML来做到这一点 - 我是一个编码新手，经过大量的实验我无法让它发挥作用。

Codepen链接：https://codepen.io/gknowl/pen/PeJbOE（适用于CSS和HTML）

HTML（所以我可以发布codepen链接）：

<pd-page>
  <pd-block id="navib" class="dont_overlap">
    <pd-component id="logo" type="logo_text" />
    <div id="navlinks">
      <pd-component id="menu" type="menu" />
      <pd-component id="local" type="locale_switcher" />
    </div>
  </pd-block>
  <pd-component id="hdtxt" type="text" class="dont_overlap" />
  <div id="title_and_main_content_wrapper">
    <div id="main_block">
      <pd-component id="mainc" type="main_content" />
      <pd-component id="commt" type="comments" />
      <pd-component id="searc" type="search" drawer="duration:0.3,rotate_alt_content:90,init_state:closed,alt_content_pos:center,alt_content:,effect:slide_from_right" />
    </div>
  </div>
  <pd-block id="footer" class="reserved_height dont_overlap">
    <pd-component id="fttxt" type="text" />
    <pd-component id="links" type="external_links" />
  </pd-block>
  <pd-component id="pwrdb" type="poweredby" />
</pd-page>

图片：https://imgur.com/Fg62kt9（绿色栏上方的部分我想要浅灰色背景）

奖励：如果有人可以帮助我将徽标设置得更大，这将是一个很大的帮助，建设者将尺寸限制为图中所示的尺寸

如果这太基础了，或者这太明显了，我道歉 - 但是我完全陷入困境。

Answer 1

你的构建器HTML标记是在codepen中渲染的，所以我只是想给你一些建议，你可以在哪里做出改变以获得理想的结果。

使徽标更大。在此课程中添加增加的宽度和高度。对于响应性，还可以在不同的媒体查询中更改同一类的宽度。

#ws_page #component_logo {
  width: //As per need;
  height: //As per need
}

对于导航背景颜色，请尝试：

#ws_page #block_navib {
  background: #ccc;
}

在全出血背景上创建一段白色背景

1 个答案: