由於每個部分的位置已經設置為relative，意味著將relative定位到上一節，因此可以將其他部分設置為left: 0 。

* {

margin: 0;

}

#all-sections{

display:inline-flex;

}

.main, .about, .professional, .fun-stuff, .blog, .contact{

height:100vh;

position: relative;

left: 0

display:block;

width:100vw;

}

.main{

background-color:white;

}

.about{

background-color:red;

}

.professional{

background-color:purple;

}

.fun-stuff{

background-color:black;

}

.blog{

background-color:blue;

}

.contact{

background-color:rgb(1, 235, 21);

}

About

Professional

Fun Stuff

Blog

Contact

如果希望導航欄始終可見，可以將該元素設置為position: fixed，它不會在滾動時移動。

#menu-list {

position: fixed;

z-index: 9999;

}

* {

margin: 0;

}

#all-sections{

display:inline-flex;

}

.main, .about, .professional, .fun-stuff, .blog, .contact{

height:100vh;

position: relative;

left: 0

display:block;

width:100vw;

}

.main{

background-color:white;

}

.about{

background-color:red;

}

.professional{

background-color:purple;

}

.fun-stuff{

background-color:black;

}

.blog{

background-color:blue;

}

.contact{

background-color:rgb(1, 235, 21);

}

About

Professional

Fun Stuff

Blog

Contact