4.8 KiB
4.8 KiB
id | title | isRequired | challengeType | videoUrl | localeTitle |
---|---|---|---|---|---|
587d78b0367417b2b2512b05 | Build a Technical Documentation Page | true | 3 | 建立技术文档页面 |
Description
main
元素,其中包含相应的id="main-doc"
,其中包含页面的主要内容(技术文档)。 用户故事#2:在#main-doc
元素中,我可以看到几个section
元素,每个元素都有一个main-section
类。应该至少为5. 用户故事#3:每个.main-section
的第一个元素应该是一个header
元素,其中包含描述该部分主题的文本。 用户故事#4:每个具有main-section
类的section
元素也应该具有与其中包含的每个header
文本对应的id。任何空格应用下划线被替换(例如该section
包含报头“JavaScript和Java”应具有相应的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
类的元素都应该包含与每个section
的header
文本相对应的文本(例如,如果你有一个“Hello world”部分/标题,你的导航栏应该有一个包含文本的元素“你好,世界”)。 用户故事#13:当我点击导航栏元素时,页面应该导航到main-doc
元素的相应部分(例如,如果我点击包含文本“Hello world”的nav-link
元素,页面导航到一个section
,其具有ID和包含相应的元件header
用户故事#14:在正常尺寸的设备(笔记本电脑,台式机),与元件id="navbar"
应该被显示在屏幕的左侧,应始终用户可以看到用户故事#15:我的技术文档页面应至少使用一个媒体查询。您可以通过分叉此CodePen笔来构建项目。或者您可以使用此CDN链接在您喜欢的任何环境中运行测试: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
完成后,将URL提交给工作项目并通过所有测试。请记住使用Read-Search-Ask方法,如果你卡住了。 Instructions
Tests
tests: []
Challenge Seed
Solution
// solution required