html - 在我的 html 显示中获得正确的 Angular

Question

所以我正在用 html 显示。我有一个导航栏，我想从屏幕左上角向下移动，还有一个标签栏从导航栏到屏幕的另一边。我目前的选项卡栏从左上角到右上角，导航栏从选项卡底部向下。如果我让导航栏从顶 Angular 开始，那么选项卡就会从屏幕中间开始，而不是在顶部运行。基本上我希望它看起来像这样:_____++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
_ n _+ 选项卡 +
_一个_+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
_ v _
_ _
_ _而不是

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+ 选项卡 +
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++______
_ n_
_ A_
_ v_

这是我的代码

<core-toolbar>
  <paper-tabs class="tabs" valueattr="name" selected="all" self-end>
    <paper-tab name="social" class="tab">SOCIAL</paper-tab>
    <paper-tab name="activity" class="tab">ACTIVITY</paper-tab>
    <paper-tab name="regularity" class="tab">REGULARITY</paper-tab>
  </paper-tabs>
</core-toolbar>
  <div class="navigation">
<div class="navTab">Results</div>
<div class="navTab">History</div>
<div class="navTab">Questions</div>
</div>

Answer 1

您可以将 div 放在工具栏之前，然后在 div 上使用 float:left;。

<div class="navigation">
    <div class="navTab">Results</div>
    <div class="navTab">History</div>
    <div class="navTab">Questions</div>
</div>
<core-toolbar>
    <paper-tabs class="tabs" valueattr="name" selected="all" self-end>
    <paper-tab name="social" class="tab">SOCIAL</paper-tab>
    <paper-tab name="activity" class="tab">ACTIVITY</paper-tab>
    <paper-tab name="regularity" class="tab">REGULARITY</paper-tab>
    </paper-tabs>
</core-toolbar>

CSS

.navigation {
    float: left;
}