<header>
<a href="#page-1">1</a>
<a href="#page-2">2</a>
<a href="#page-3">3</a>
</header>
<article id="page-1">1</article>
<article id="page-2">2</article>
<article id="page-3">3</article>
*
margin 0
padding 0
box-sizing border-box
html
overflow-y scroll
scroll-behavior smooth
body
overflow hidden
article
min-height 100vh
display flex
align-items center
justify-content center
font-size 5em
background #f2f2f2
header
background black
position fixed
top 0
left 0
right 0
display flex
align-items center
a
display inline-block
width 50px
text-decoration none
color white
padding 1rem
text-align center
transition .2s
&:hover
background #222
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.