<\/p>\n
System\uff1a<\/strong><\/p>\n
Your task is to create a one-page website based on the given specifications, delivered as an HTML file with embedded JavaScript and CSS. The website should incorporate a variety of engaging and interactive design features, such as drop-down menus, dynamic text and content, clickable buttons, and more. Ensure that the design is visually appealing, responsive, and user-friendly. The HTML, CSS, and JavaScript code should be well-structured, efficiently organized, and properly commented for readability and maintainability.<\/p>\n
<\/p>\n
User\uff1a<\/strong><\/p>\n
Create a one-page website for an online learning platform called “EduQuest” with the following features and sections:
1. A fixed navigation bar with links to course categories (Math, Science, Languages, Arts) and a search bar.
2. A hero section with a video background showcasing students learning online, a dynamic tagline that rotates between “Learn at your own pace,” “Discover new passions,” and “Expand your horizons” every 3 seconds, and a “Get Started” button leading to a course catalog.
3. A featured courses section displaying course cards with placeholders for course images, titles, instructors, and descriptions.
4. An interactive “Learning Paths” section with a short quiz to determine learning styles and interests, and a button to start the quiz.
5. A “Success Stories” section featuring testimonials from satisfied students, with placeholders for the testimonial text and student names.
6. A footer with links to the platform’s blog, FAQ, privacy policy, and a “Contact Us” button that opens a modal window with a contact form and customer support information.
Include filler placeholder content for the video background, course cards, and testimonials. Embed the CSS styles within the\u00a0<style><\/span><\/code>\u00a0tag in the\u00a0<head><\/span><\/code>\u00a0section and place the JavaScript code within the\u00a0<script><\/span><\/code>\u00a0tag at the end of the\u00a0<body><\/span><\/code>\u00a0section.
The JavaScript code should handle the dynamic tagline in the hero section, rotating through the different taglines every 3 seconds.<\/p><\/blockquote>\n<\/p>\n
<\/p>\n
Website wizard \u8bd1\u6587<\/h2>\n
<\/p>\n
System\uff1a<\/strong><\/p>\n
\u4f60\u7684\u804c\u8d23\u662f\u6309\u7167\u6240\u7ed9\u89c4\u683c\u521b\u5efa\u4e00\u4e2a\u5355\u9875\u7f51\u7ad9\uff0c\u5e76\u4ee5\u5d4c\u5165JavaScript\u548cCSS\u7684HTML\u6587\u4ef6\u5f62\u5f0f\u63d0\u4ea4\u3002\u8fd9\u4e2a\u7f51\u7ad9\u5e94\u5145\u6ee1\u5404\u79cd\u751f\u52a8\u4e92\u52a8\u7684\u8bbe\u8ba1\u7279\u6027\uff0c\u4f8b\u5982\u4e0b\u62c9\u83dc\u5355\u3001\u52a8\u6001\u6587\u672c\u548c\u5185\u5bb9\u3001\u53ef\u70b9\u51fb\u7684\u6309\u94ae\u7b49\u7b49\uff0c\u4fdd\u8bc1\u8bbe\u8ba1\u7684\u89c6\u89c9\u6548\u679c\u51fa\u8272\uff0c\u53cd\u5e94\u8fc5\u901f\uff0c\u5e76\u5bf9\u7528\u6237\u53cb\u597d\u3002HTML\u3001CSS\u548cJavaScript\u4ee3\u7801\u5e94\u7f16\u6392\u5f97\u6761\u7406\u6e05\u6670\uff0c\u9ad8\u6548\u6709\u5e8f\uff0c\u5e76\u5bf9\u5173\u952e\u90e8\u5206\u8fdb\u884c\u9002\u5f53\u6ce8\u91ca\u4ee5\u5229\u4e8e\u9605\u8bfb\u548c\u7ef4\u62a4\u3002<\/p>\n
<\/p>\n
User\uff1a<\/strong><\/p>\n
\u9488\u5bf9\u4e00\u4e2a\u540d\u53eb”EduQuest”\u7684\u5728\u7ebf\u5b66\u4e60\u5e73\u53f0\uff0c\u521b\u5efa\u4e00\u4e2a\u5355\u9875\u7f51\u7ad9\uff0c\u7f51\u7ad9\u9700\u5305\u542b\u4ee5\u4e0b\u529f\u80fd\u548c\u677f\u5757\uff1a<\/p>\n
1. \u4e00\u4e2a\u56fa\u5b9a\u5728\u9876\u90e8\u7684\u5bfc\u822a\u680f\uff0c\u5305\u542b\u6307\u5411\u5404\u8bfe\u7a0b\u5206\u7c7b\u7684\u94fe\u63a5\uff08\u6570\u5b66\uff0c\u79d1\u5b66\uff0c\u8bed\u8a00\uff0c\u827a\u672f\uff09\uff0c\u4ee5\u53ca\u4e00\u4e2a\u641c\u7d22\u6846\u3002<\/p>\n
2. \u4e00\u4e2a\u4e3b\u6253\u533a\u5757\uff0c\u4ee5\u5e26\u6709\u80cc\u666f\u89c6\u9891\u7684\u5f62\u5f0f\u5c55\u793a\u5b66\u751f\u5728\u7ebf\u5b66\u4e60\u7684\u60c5\u5883\uff0c\u542b\u6709\u4e00\u4e2a\u52a8\u6001\u6807\u8bed\uff0c\u6bcf3\u79d2\u95f4\u9694\u8f6e\u64ad”\u5b66\u5728\u81ea\u5df1\u7684\u8282\u594f”\uff0c”\u6316\u6398\u65b0\u7684\u5174\u8da3\u7231\u597d”\uff0c\u4ee5\u53ca”\u5f00\u62d3\u4f60\u7684\u89c6\u91ce”\u7b49\u5185\u5bb9\uff0c\u5e76\u8bbe\u7f6e\u4e00\u4e2a\u201c\u5f00\u59cb\u5b66\u4e60\u201d\u6309\u94ae\uff0c\u70b9\u51fb\u540e\u8fdb\u5165\u8bfe\u7a0b\u5206\u7c7b\u5c55\u793a\u3002<\/p>\n
3. \u4e00\u4e2a\u7279\u8272\u8bfe\u7a0b\u533a\u5757\uff0c\u5c55\u793a\u72ec\u7279\u7684\u8bfe\u7a0b\u5361\u7247\uff0c\u6bcf\u4e00\u5f20\u5361\u7247\u4e2d\u90fd\u6709\u624b\u52a8\u6dfb\u52a0\u7684\u8bfe\u7a0b\u56fe\u7247\u3001\u6807\u9898\u3001\u6388\u8bfe\u6559\u5e08\u548c\u8bfe\u7a0b\u7b80\u4ecb\u7684\u5360\u4f4d\u6587\u672c\u3002<\/p>\n
4. \u4e00\u4e2a\u4e92\u52a8\u6027\u7684”\u5b66\u4e60\u8def\u5f84”\u533a\u5757\uff0c\u5305\u542b\u4e00\u4e2a\u77ed\u5c0f\u6d4b\u8bd5\uff0c\u7528\u4e8e\u4e86\u89e3\u5b66\u4e60\u8005\u7684\u5b66\u4e60\u98ce\u683c\u548c\u5174\u8da3\uff0c\u4ee5\u53ca\u4e00\u4e2a\u5f00\u59cb\u6d4b\u8bd5\u7684\u6309\u94ae\u3002<\/p>\n
5. \u4e00\u4e2a”\u6210\u529f\u6848\u4f8b”\u533a\u5757\uff0c\u5c55\u793a\u6ee1\u610f\u5b66\u751f\u7684\u8bfe\u7a0b\u53cd\u9988\uff0c\u91c7\u7528\u603b\u7ed3\u6587\u672c\u548c\u5b66\u751f\u59d3\u540d\u7684\u5360\u4f4d\u6587\u672c\u5f62\u5f0f\u3002<\/p>\n
6. \u7f51\u7ad9\u5e95\u90e8\u662f\u7f51\u7ad9\u9875\u811a\uff0c\u542b\u6709\u94fe\u63a5\u81f3\u5e73\u53f0\u535a\u5ba2\uff0c\u5e38\u89c1\u95ee\u9898\uff0c\u9690\u79c1\u653f\u7b56\u7b49\u5730\u65b9\u7684\u94fe\u63a5\uff0c\u4ee5\u53ca\u4e00\u4e2a\u4f1a\u5f39\u51fa\u5e26\u6709\u8054\u7cfb\u8868\u683c\u548c\u5ba2\u6237\u652f\u6301\u4fe1\u606f\u7684\u6a21\u6001\u7a97\u53e3\u7684”\u8054\u7cfb\u6211\u4eec”\u6309\u94ae\u3002<\/p>\n
\u5728\u89c6\u9891\u80cc\u666f\u3001\u8bfe\u7a0b\u5361\u7247\u548c\u53cd\u9988\u8fd9\u4e9b\u90e8\u5206\uff0c\u6682\u586b\u5360\u4f4d\u5185\u5bb9\u3002CSS\u6837\u5f0f\u4ee3\u7801\u8bf7\u653e\u5728<head>\u90e8\u5206\u7684<style>\u6807\u7b7e\u4e2d\uff0cJavaScript\u4ee3\u7801\u8bf7\u653e\u5728<body>\u90e8\u5206\u95ed\u5408\u524d\u7684<script>\u6807\u7b7e\u4e2d\u3002<\/p>\n
\u8d1f\u8d23\u5904\u7406\u4e3b\u6253\u533a\u5757\u4e2d\u7684\u52a8\u6001\u6807\u8bed\u7684JavaScript\u4ee3\u7801\uff0c\u9700\u8bbe\u5b9a\u6bcf3\u79d2\u66f4\u66ff\u4e00\u6b21\u6807\u8bed\u5185\u5bb9\u3002<\/p><\/blockquote>\n","protected":false},"excerpt":{"rendered":"
Website wizard \u539f\u6587 System\uff1a Your task is to create a one-page website based on the given specifications, delivered …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[32,23],"class_list":["post-898","post","type-post","status-publish","format-standard","hentry","category-prompts","tag-claude","tag-daima"],"_links":{"self":[{"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/posts\/898","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/comments?post=898"}],"version-history":[{"count":0,"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/posts\/898\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/media?parent=898"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/categories?post=898"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.kdjingpai.com\/ja\/wp-json\/wp\/v2\/tags?post=898"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}