4.5 KiB
4.5 KiB
id, challengeType, forumTopicId, localeTitle
| id | challengeType | forumTopicId | localeTitle |
|---|---|---|---|
| 587d78b0367417b2b2512b05 | 3 | 301146 | 制作一个技术文档页面 |
Description
id="main-doc"的main元素，它包含页面的主要内容（技术文档）。
需求 2：在#main-doc元素内，我能看见至少 5 个section元素，每个元素都有一个main-section类属性。
需求 3：每个.main-section中的第一个元素应该是header元素，其中包含描述该部分主题的文本。
需求 4：具有main-section类的每个section元素应该有一个与包含在其中的每个header的文本相对应的 id，用下划线替换文本中的所有空格（例如，包含标题 "Javascript and Java" 的section应该有对应id="Javascript_and_Java"）。
需求 5：所有.main-section元素总计包含至少 10 个p元素。
需求 6：所有.main-section元素总计包含至少 5 个code元素。
需求 7：所有.main-section元素总计包含至少 5 个li项。
需求 8：我能看见一个对应id="navbar"的nav元素。
需求 9：navbar 元素应包含一个header元素，其中包含描述技术文档主题的文本。
需求 10：此外，导航栏应包含类名为nav-link的链接元素（a），每个元素都应该有一个类main-section。
需求 11：导航栏中的header元素必须位于导航栏中的任何链接（a）元素之前。
需求 12：具有nav-link类的每个元素都应该包含每个部分的标题文本对应的文本（例如，如果你有一个“Hello world”部分/标题，你的导航栏应该有一个包含文本“Hello world”的元素）。
需求 13：当我点击一个 navbar 元素时，页面应该导航到main-doc元素的相应部分（例如，如果我单击包含文本 "Hello world" 的nav-link元素，页面将导航到一个带有对应 header 和 id 的section 元素）。
需求 14：在常规尺寸的设备上（笔记本电脑，台式机），带有id="navbar"的元素应该显示在屏幕左侧，并且始终对用户可见。
需求 15：我的技术文档页面应该至少使用一次媒体查询。
你可以通过 fork 这个项目 CodePen 来构建你的项目，也可以使用此 CDN 链接在任何你喜欢的环境中运行测试：https://gitcdn.link/repo/freeCodeCamp/testable-projects-fcc/master/build/bundle.js。
完成项目并通过所有测试后，输入你的项目在 CodePen 上的链接。
完成之后，将你的 URL 提交到相应的项目，并测试通过。
Instructions
Tests
tests: []
Challenge Seed
Solution
// solution required