我正在尝试创建一个投资组合,当用户滚动时,可以看到并修复一个小条形图标。点击后,它应该在导航栏中显示工具,如“关于我,与我联系”。
我尝试使用position:fixed;但它没有用。
我似乎无法将此栏图标显示在页面左侧。尝试给它不同的边距和填充,下拉也不起作用。
.fa {
transform: scale(0.5,0.5);
}
.dropdown{
position: fixed;
}
<div class="container">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle pull-left" type="button" id="menu1" data-toggle="dropdown"><i class="fa fa-bars" aria-hidden="true"></i></button>
<span class="caret"></span></button>
<nav role="navigation">
<ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Home</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">About</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Contact</a></li>
</ul>
</nav>
</div>
</div>
答案 0 :(得分:1)
.dropdown不一定是孩子的另一个元素,除了身体
body {
position: relative;
height: 200vh;
background: linear-gradient(orange 0, red 50%, pink 100%);
}
.dropdown{
position: fixed;
width: 140px;
height: 180px;
background-color: blue;
}
实施例:
<div class="dropdown">
</div>
myClass.method1();