我想滚动到一个特定的部分,在html中,使用href和onclick="window.location="但这行不通。有人能帮帮我吗?这是我的代码:
<html lang="en">
<Head>
<title>Portfolio</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
</Head>
<body>
<section class="section1" id="#section1"></section>
<section class="section2" id="#section2"></section>
<section class="section3" id="#section3"></section>
<section class="section4" id="#section4"></section>
<footer>
<div class="menu-btn">
<div class="trep"></div>
<div href="#section2" class="chi-sono"></div>
<div onclick="window.location='#section3';" class="progetti"></div>
<div onclick="window.location='#section4';" class="contattami"></div>
</div>
</footer>
</body>
</html>```
id
不能包含#
。删除:
section{
height:500px;
background-color:#ededed;
margin:10px;
}
<html lang="en">
<Head>
<title>Portfolio</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
</Head>
<body>
<section class="section1" id="section1"></section>
<section class="section2" id="section2"></section>
<section class="section3" id="section3"></section>
<section class="section4" id="section4"></section>
<footer>
<div class="menu-btn">
<div class="trep"></div>
<div href="#section2" class="chi-sono"></div>
<div onclick="window.location='#section3';" class="progetti">Jump to section 3</div>
<div onclick="window.location='#section4';" class="contattami">Jump to section 4</div>
</div>
</footer>
</body>
</html>