Tell us what’s happening:
I got a mistake (None of your header elements should be empty.) and I can’t find it. Please help me.
Your code so far
<!doctype html>
<html lang="en">
<header>
<title>languages</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link href="styles.css" rel="stylesheet"/>
</header>
<body>
<main id="main-doc">
<section class="main-section" id="Java">
<header>Java</header>
<p>Java — строго типизированный объектно-ориентированный язык программирования общего назначения, разработанный компанией Sun Microsystems (в последующем приобретённой компанией Oracle).</p>
<p>
Это один из наиболее известных и популярных языков, который используют во многих компаниях, в том числе в Netflix, AliExpress, Google, Intel, eBay, TripAdvisor и многих других.</p>
<code><pre>class HelloWorld {
public static void main(String args) {
System.out.println("Hello, World!");
}
}</pre>
</code>
<p>Некоторые области применения Java:</p>
<ul>
<li> На Java создают разные приложения, например корпоративные системы управления (Enterprise Resource Planning, ERP).</li>
<li> У Java есть платформа для разработки веб-приложений и серверных компонентов. </li>
<li> С помощью Java можно создавать приложения для операционных систем Android.</li>
</ul>
</section>
<section class="main-section" id="JavaScript">
<header>JavaScript</header>
<p>JavaScript — это интерпретируемый язык программирования высокого уровня, который в основном используется в качестве языка сценариев для веб-разработки.</p>
<p>С его помощью сайты делают интерактивными: добавляют всплывающие окна, анимацию, кнопки лайков и формы для отправки информации.
</p>
<code>console.log('Привет, мир!');</code>
<p>Некоторые области применения JavaScript:</p>
<ul>
<li> Практически на каждом современном сайте используют код, написанный на JS.</li>
<li> Небольшие простые скрипты, которые добавляют дополнительный функционал — блокируют рекламу, позволяют сохранять аудио, отправляют уведомления о новых письмах или меняют цветовую схему сайта.</li>
<li> Язык программирования JavaScript можно использовать для написания любых сервисов: чатов, компьютерных программ и даже нейросетей. Для этого к нему нужно подключить движок Node.js.</li>
</ul>
</section>
<section class="main-section" id="Python">
<header>Python</header>
<p>Python — мультипарадигмальный высокоуровневый язык программирования общего назначения с динамической строгой типизацией и автоматическим управлением памятью.
</p>
<p>Отличается эффективностью, простотой и универсальностью использования. Широко применяется в разработке веб-приложений и прикладного программного обеспечения, а также в машинном обучении и обработке больших данных.
</p>
<code>print("Hello, World!")</code>
<p>Некоторые характеристики Python:</p>
<ul>
<li> Операторы кода исполняются последовательно с помощью программы-интерпретатора. Если по ходу исполнения программы встречается ошибка, оно сразу же прекращается.</li>
<li> Это автоматическое связывание переменной и типа в момент, когда ей присваивается определённое значение.</li>
<li> Написанная на Python программа представляет собой совокупность объектов, каждому из которых присвоены определённый класс и место в иерархии.</li>
</ul>
</section>
<section class="main-section" id="C++">
<header>C++</header>
<p>C++ — компилируемый статически типизированный язык программирования общего назначения. Обеспечивает модульность, раздельную компиляцию, обработку исключений, абстракцию данных, объявление типов (классов) объектов, виртуальные функции.
</p>
<p>C++ широко используется для разработки программного обеспечения, являясь одним из самых популярных языков программирования. Область его применения включает создание операционных систем, разнообразных прикладных программ, драйверов устройств, приложений для встраиваемых систем, высокопроизводительных серверов, а также компьютерных игр.
</p>
<code><pre>#include <iostream>
using namespace std;
int main() {
cout << "Hello, world!" << endl;
return 0;
}
</pre></code>
<p>Некоторые характеристики C++:</p>
<ul>
<li>На плечи программиста ложится много дополнительной работы: проверка корректности данных, управление памятью, обработка низкоуровневых ошибок.</li>
<li>На C++ можно писать программы в рамках нескольких парадигм программирования: процедурное, объектно-ориентированное, обобщённое, функциональное, генеративное.</li>
<li>Чтобы запустить программу на C++, её нужно сначала скомпилировать.</li>
</ul>
</section>
<section class="main-section" id="PHP">
<header>PHP</header>
<p>PHP — это скриптовый язык программирования с открытым исходным кодом.
</p>
<p>Основная область применения — разработка скриптов, которые работают на стороне сервера. Также можно создавать скрипты командной строки и GUI-приложения (приложения с графическим интерфейсом пользователя).
</p>
<code>?php echo "Hello, World!"; ?
</code>
<p>Некоторые характеристики PHP:</p>
<ul>
<li>Переменная не определяется жёстко и заранее. Это позволяет присваивать одной и той же переменной несколько значений: она может быть массивом, строкой, числом, объектом и т. д.</li>
<li>Код, который написан на PHP, не компилируется (преобразуется в машинный), а выполняется строка за строкой с помощью программы-интерпретатора. </li>
<li>PHP поддерживается на различных операционных системах (Windows, Linux, macOS) и работает с различными веб-серверами (Apache, Nginx).</li>
</ul>
</section>
</main>
<nav id="navbar">
<header>Programm languages</header>
<a href="#Java" class="nav-link">Java</a>
<a href="#JavaScript" class="nav-link">JavaScript</a>
<a href="#Python" class="nav-link">Python</a>
<a href="#C++" class="nav-link">C++</a>
<a href="#PHP" class="nav-link">PHP</a>
</nav>
</body>
</html>
*{
box-sizing:border-box;
}
#navbar{
display:flex;
position:fixed;
top:0;
left:0;
height:100%;
width: 200px;
flex-direction:column;
align-items:center;
border-right:1px solid black;
}
main{
margin-left: 220px;
font-size:18px;
}
#navbar header, a{
width:100%;
height:100%;
border-bottom:1px solid black;
display:flex;
align-items:center;
justify-content:center;
}
#navbar a:last-child{
border:none;
}
a{
font-size:18px;
color:black;
text-decoration:none;
}
@media (max-width: 768px) {
body {
font-size: 14px;
}
}
header{
font-size:20px;
font-weight:700;
}
section{
padding-top:20px;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36 OPR/114.0.0.0 (Edition Yx GX)
Challenge Information:
Technical Documentation Page - Build a Technical Documentation Page