我只是在学习 react 并想使用 react-paginate 进行分页,但即使我已经将必要的 css 放在我的全局 css 文件(index.css)中,样式也无法在 atm 中工作
<div id="react-paginate">
<ReactPaginate
previousLabel={'<'}
nextLabel={'>'}
breakLabel={<a href="">...</a>}
breakClassName={'break-me'}
pageCount={pageCount}
marginPagesDisplayed={2}
pageRangeDisplayed={10}
onPageChange={this.handlePageClick}
containerClassName={'pagination'}
subContainerClassName={'pages pagination'}
activeClassName={'active'}
/>
</div>
Run Code Online (Sandbox Code Playgroud)
我的 css 文件
#react-paginate ul {
display: inline-block;
margin-left: 20px;
padding-left: 0;
}
#react-paginate li {
display: inline-block;
border: 1px solid rgb(224, 224, 224);
color: #000;
cursor: pointer;
margin-right: 3px;
border-radius: 5px;
margin-bottom: 5px;
}
#react-paginate li a {
padding: 2px 5px;
display: inline-block;
color: #000;
outline: none;
}
#react-paginate li.active …Run Code Online (Sandbox Code Playgroud) <div class="navbar">
<nav class="navbar navbar-dark bg-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">company name</a>
</div>
<ul class="nav navbar-nav navbar-right ">
<li><a href="#" style="color:white;">About</a></li>
<li><a href="#" style="color:white;">Portfolio</a></li>
<li><a class="portfolio-scroll" href="#" style="color:white;" id="contact-nav">Contact</a></li>
</ul>
</div>
</nav>
Run Code Online (Sandbox Code Playgroud)
我想让我的导航栏在点击导航栏中的选项之一时页面会滚动到页面中的特定部分,例如,当我点击导航栏上的联系人时,页面会向下滚动到同一页面中的联系人部分
如何制作这样的东西,有人可以帮助我吗?