Technical Documentation Page - Build a Technical Documentation Page

HTML-CSS
1

**Tell us what’s happening:**Your Technical Documentation project should use at least one media query.

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36 Edg/109.0.1518.78

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

2

Hi there! Did you have a question?

3

i keep get this error :
Your Technical Documentation project should use at least one media query.

I don’t know how to fix it. I keep obsessing over this mistake so that I can’t succeed.Can you help me?Please.Thank you very much.

Here is all of my current code:

<html>
  <head>
    <meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"/>
    <title>My Technical Documentation Page</title>
    <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
  </head>
  <body>
    <nav id="navbar">
        <header id="nav-head">Navbar</header>
        <a href="#HTML" class="nav-link">HTML</a>
        <a href="#CSS" class="nav-link">CSS</a>
        <a href="#JavaScript" class="nav-link">JavaScript</a>
        <a href="#Java" class="nav-link">Java</a>
        <a href="#jQuery" class="nav-link">jQuery</a>
      </nav>
    <main id="main-doc">
      <section class="main-section" id="HTML">
        <header>HTML</header>
        <p>超文本标记语言（Hyper Text Markup Language），缩写为HTML，标准通用标记语言下的一个应用。HTML不是一种编程语言，而是一种标记语言 （markup language），是网页制作所必备的工具。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。</p>
        <p>超文本标记语言(或超文本标签语言)的结构包括“头”部分和“主体”部分，其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。
        </p>
        <ul>
          <li>语言特点</li>
          <li>书写方式</li>
          <li>整体结构</li>
        </ul>
        <code></code>
      <section>
      <section class="main-section" id="CSS">
        <header>CSS</header>
        <p>层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。</p>
        <p>CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。</p>
        <ul>
          <li></li>
          <li></li>
          <li></li>
        </ul>
        <code></code>
      </section>
      <section class="main-section" id="JavaScript">
        <header>JavaScript</header>
        <p>JavaScript（缩写为JS）是一种高级的、多范式、解释型的编程语言，是一门基于原型、函数先行的语言，它支持面向对象编程、命令式编程以及函数式编程。</p>
        <p>它提供语法来操控文本、数组、日期以及正则表达式，不支持I/O（比如网络、存储和图形等），但可以由它的宿主环境提供支持。它已经由ECMA（欧洲计算机制造商协会）通过ECMAScript实现语言的标准化。它被世界上的绝大多数网站所使用，也被世界主流浏览器支持。</p>
        <ul>
          <li></li>
          <li></li>
          <li></li>
        </ul>
        <code></code>
      </section>
      <section class="main-section" id="Java">
        <header>Java</header>
        <p>Java是由Sun公司于1995年5月推出的面向对象的程序设计语言。</p>
        <p>Java继承了C++语言面向对象技术的核心，又舍弃了C++语言中的指针、运算符重载以及多重继承的特性，同时引入了泛型编程、类型安全的枚举等特性，使Java成为简单、面向对象、分布式、解释性、健壮、安全与系统无关、可移植、高性能、多线程和动态的语言。</p>
        <p>随着互联网的迅猛发展，Java已经成为重要的网络编程语言，被广泛应用于企业级Web应用开发和移动应用开发。</p>
        <ul>
          <li></li>
          <li></li>
          <li></li>
        </ul>
        <code></code>
      </section>
      <section class="main-section" id="jQuery">
        <header>jQuery</header>
        <p>jquery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。</p>
        <p>jquery设计的宗旨是“write Less，Do More”（即倡导写更少的代码，做更多的事情），其核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。</p>
        <ul>
          <li></li>
          <li></li>
          <li></li>
        </ul>
        <code></code>
      </section>
    </main>
  </body>
</html>
4

Did you create a media query in your styles.css file?

Did you link the styles.css file in your index.html (I don’t see any link element)

5

I don’t seem to know. Can you show me the correct way to write it

6

You can google anything your forgot.
Here is an example of a link element for eg

7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.