我想转到about部分，而不需要链接到另一个。html文件。 最初，我尝试使用href=“About.html”，但当单击About按钮时，它只是链接到该页面，而忽略了index.html页面，其中包含所有主要内容。 接下来，我尝试了一个href=#about，当按下about按钮时它什么也不做。
null
section{
padding: 39px 0;
}
.container{
width: 100%;
max-width: 1225px;
margin: 0 auto;
padding: 0 24px;
}
.headline-description h5{
color: #ffffff;
font-size: 30px;
font-weight: 100;
text-transform: uppercase;
margin-bottom: 20px;
letter-spacing: 4px;
}
.Content{
width: 100%;
background-color: bisque;
height: 100vh;
display: flex;
align-items: center;
text-align: center;
}
.about-button{
text-decoration: none;
color: #225522;
border: 1px solid #225522;
padding: 10px 50px;
font-size: 20px;
transition: all 1s;
}
.the-life-of-a-chef{
background-color: #2255cc;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CHEF</title>
<link rel="stylesheet" href="asdf.css">
</head>
<body>
<section class="Content" id="Content">
<div class="container">
<!--Website Name-->
<h1 class="headline">C H E F</h1>
<div class="headline-description">
<div class="seperator">
<!--Underline Chef / Cutlery Icon in middle-->
<div class="line line-left"></div>
<div class="cutlery"><i class="fa fa-cutlery"></i></div>
<div class="line line-right"></div>
</div>
<h5>Life of a chef</h5>
<a href="#About" class="button about-button">About</a>
</div>
</div>
</section>
</body>
</html>
<section class="the-life-of-a-chef">
<div class="container">
<div class="rest-button">
<div class="Lorem-text">
<div class="LifeOfChefHeadline">
<h2 class="AboutHeadline">
<span class="About">About</span>
</h2>
<h1 class="headline headline-gold">The Life Of A Chef</h1>
</div>null
只需将id=“关于”添加到要滚动到的部分。 请参阅此处的示例:https://jsfiddle.net/ud3k2ztv/
