You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

99 lines
2.8 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>帮助中心</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #f5f5f5;
padding: 10px;
display: flex;
justify-content: space-between;
align-items: center;
}
header a {
text-decoration: none;
color: #333;
}
main {
padding: 20px;
}
.faq-category {
margin-bottom: 20px;
}
.faq-category h2 {
font-size: 18px;
margin-bottom: 10px;
}
.faq-question {
cursor: pointer;
padding: 5px 0;
border-bottom: 1px dashed #ddd;
}
.faq-answer {
display: none;
padding: 10px 0;
}
.contact-us {
margin-top: 20px;
font-size: 14px;
}
</style>
</head>
<body>
<header>
<a href="#">返回首页</a>
<input type="text" placeholder="搜索帮助中心">
</header>
<main>
<div class="faq-category">
<h2>点名操作</h2>
<div class="faq-question">如何开始点名?</div>
<div class="faq-answer">点击点名页面上的“开始点名”按钮即可开始点名操作。</div>
<div class="faq-question">点名结果如何查看?</div>
<div class="faq-answer">点名结束后,系统会在页面上显示点名结果,您也可以在个人中心的点名历史中查看。</div>
</div>
<div class="faq-category">
<h2>账号问题</h2>
<div class="faq-question">如何注册账号?</div>
<div class="faq-answer">在首页点击“注册”按钮,填写相关信息即可注册账号。</div>
<div class="faq-question">忘记密码怎么办?</div>
<div class="faq-answer">点击登录页面上的“忘记密码”链接,按照提示进行操作即可重置密码。</div>
</div>
<div class="contact-us">
<p>如果您还有其他问题,请联系我们:</p>
<p>客服邮箱1111111@qq.com</p>
</div>
</main>
<script>
const faqQuestions = document.querySelectorAll('.faq-question');
faqQuestions.forEach(question => {
question.addEventListener('click', () => {
const answer = question.nextElementSibling;
if (answer.style.display === 'none') {
answer.style.display = 'block';
} else {
answer.style.display = 'none';
}
});
});
</script>
</body>
</html>