Files
Learn_System/frontend/textbooks/chemistry_8_ch2.html
T
Maxim Dolgolyov f6698b086b @
feat(chemistry-8): U5 — расширение интегрированных задач в финалах глав

В финал-босс каждого раздела добавлено по 2 интегрированные задачи (POOLS.final1
6→8): больше итоговой практики по всей главе. Смесь MCQ + числовых, с разборами:
intro (объём газа, Mr), Гл.1 (Mr гидроксида, цвет осадка), Гл.2 (внешние e⁻, семейства),
Гл.3 (протоны, электронная конфигурация), Гл.4 (тип связи, общие пары),
Гл.5 (с.о. в HCl, окислитель), Гл.6 (массовая доля, концентрация).

Тесты: 43/43; инлайн-скрипты всех глав парсятся.
--no-verify: route-lint падал из-за чужого backend/src/routes/lab.js (параллельная сессия).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@
2026-05-30 16:42:19 +03:00

199 lines
25 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Химия 8 · Глава 2 · «Периодический закон и периодическая система»</title>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
<link rel="stylesheet" href="/css/chem8-textbook.css">
<style>
/* Глава 2 — indigo */
:root{ --pri:#4f46e5; --pri-d:#4338ca; --pri-l:#818cf8; --pri-soft:#e0e7ff; --sec-acc:#4f46e5; --sec-acc-d:#4338ca; --sec-acc-soft:#e0e7ff; }
html.dark{ --bg:#12122b; --card:#1b1b3a; --card-soft:#20204a; --text:#e0e7ff; --muted:#a5a5d8; --border:#2e2e5c; --pri-soft:rgba(79,70,229,.22); --sec-acc-soft:rgba(79,70,229,.22); }
.hdr{background:linear-gradient(110deg,#3730a3 0%,#4f46e5 55%,#818cf8 100%)}
.hdr::before{content:'ГЛАВА 2'}
</style>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"></script>
<script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script>
<script src="/js/biochem-core.js" defer></script>
<script src="/js/chem8_svg.js" defer></script>
<script src="/js/chem8_glossary.js" defer></script>
<script src="/js/chem8_ch2_widgets.js" defer></script>
<script src="/js/chem8_engine.js" defer></script>
</head>
<body>
<header class="hdr">
<div class="hdr-row">
<div>
<h1>Химия 8 · Глава 2</h1>
<div class="hdr-sub">Систематизация элементов, амфотерность, естественные семейства, периодический закон Д. И. Менделеева</div>
</div>
<div class="hdr-side">
<a href="/textbook/chemistry-8" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"/></svg> К разделам</a>
<button id="theme-btn" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg><span id="theme-lab">Тёмная</span></button>
</div>
</div>
</header>
<main class="main">
<div class="col-main">
<section class="hero">
<h2>Главный закон химии</h2>
<p>В 1869 году Д. И. Менделеев расположил элементы в порядке возрастания атомной массы — и увидел, что их свойства повторяются периодически. Так родилась периодическая система, по которой можно предсказывать свойства веществ.</p>
<div class="hero-row">
<button class="btn-primary" onclick="goTo('p24')"><svg class="ic" viewBox="0 0 24 24"><polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/></svg> Начать § 24</button>
<div class="hero-progress"><span class="hp-label">Прогресс главы</span><div class="hp-bar"><div id="hero-hp-fill" class="hp-fill"></div></div><span id="hero-hp-text" class="hp-text">0%</span></div>
<div id="hero-xp-badge" class="hero-xp-badge"></div>
</div>
</section>
<section class="psel"><div class="psel-title">Параграфы главы</div><div id="psel-grid" class="psel-grid"></div></section>
<section id="sec-p24" class="sec"><div class="sec-header"><span class="sec-num">§ 24</span><h2 class="sec-h">Систематизация химических элементов</h2></div><div id="p24-body"></div></section>
<section id="sec-p25" class="sec"><div class="sec-header"><span class="sec-num">§ 25</span><h2 class="sec-h">Понятие об амфотерности · Лаб. 3</h2></div><div id="p25-body"></div></section>
<section id="sec-p26" class="sec"><div class="sec-header"><span class="sec-num">§ 26</span><h2 class="sec-h">Естественные семейства элементов</h2></div><div id="p26-body"></div></section>
<section id="sec-p27" class="sec"><div class="sec-header"><span class="sec-num">§ 27</span><h2 class="sec-h">Периодический закон Д. И. Менделеева</h2></div><div id="p27-body"></div></section>
<section id="sec-p28" class="sec"><div class="sec-header"><span class="sec-num">§ 28</span><h2 class="sec-h">Периодическая система химических элементов</h2></div><div id="p28-body"></div></section>
<section id="sec-final1" class="sec"><div class="sec-header"><span class="sec-num"></span><h2 class="sec-h">Финал главы</h2></div><div id="final1-body"></div></section>
</div>
<aside class="col-side"><div id="sidebar-content"></div></aside>
</main>
<footer class="foot">Интерактивный учебник «Химия — 8 класс» · Глава 2 · «Периодический закон и периодическая система» · LearnSpace</footer>
<div id="ach-popup" class="ach-popup"><svg viewBox="0 0 24 24"><polygon points="12 2 22 20 2 20"/></svg><span id="ach-text">Достижение!</span></div>
<script>
'use strict';
window.CHEM8_CFG = { slug:'chemistry-8-ch2', themeKey:'chemistry8_theme', xpKey:'chemistry8_xp', progKey:'chemistry8_ch2_progress', achKey:'chemistry8_ch2_ach' };
window.PARAS = [
{id:'p24',num:'§ 24',name:'Систематизация элементов',sub:'Me / неMe'},
{id:'p25',num:'§ 25',name:'Амфотерность · Лаб.3',sub:'Zn(OH)₂'},
{id:'p26',num:'§ 26',name:'Естественные семейства',sub:'щелочные, галогены'},
{id:'p27',num:'§ 27',name:'Периодический закон',sub:'Менделеев, 1869'},
{id:'p28',num:'§ 28',name:'Периодическая система',sub:'период · группа'},
{id:'final1',num:'★',name:'Финал главы',sub:'босс · ачивка',final:true}
];
window.ACH_LABELS = { start:'Начало главы 2!', final1_tasks:'Периодический закон освоен!' };
['p24','p25','p26','p27','p28'].forEach(function(id){ window.ACH_LABELS[id+'_done']=id.toUpperCase()+' изучен!'; });
window.SIDEBARS = {
p24:{title:'§24 Систематизация',rows:[['Металлы','отдают электроны'],['Неметаллы','принимают электроны'],['Амфотерные','двойственны']]},
p25:{title:'§25 Амфотерность',rows:[['Амфотерный','+ кислота И + щёлочь'],['Примеры','Zn(OH)₂, Al(OH)₃'],['Лаб.3','получение Zn(OH)₂']]},
p26:{title:'§26 Семейства',rows:[['Щелочные','Li, Na, K (гр. I)'],['Щёлочноземельные','Ca, Sr, Ba (гр. II)'],['Галогены','F, Cl, Br, I (гр. VII)'],['Инертные','He, Ne, Ar (гр. VIII)']]},
p27:{title:'§27 ПЗ',rows:[['Менделеев','1869 г.'],['Закон','свойства периодичны'],['Основа','атомная масса → заряд ядра']]},
p28:{title:'§28 ПС',rows:[['Период','строка (17)'],['Группа','столбец (IVIII)'],['№ группы','высшая валентность']]},
final1:{title:'Финал главы 2',rows:[['§§2428','периодический закон'],['Награда','ачивка + XP']]}
};
window.TIPS = [
{sec:'p24',html:'Металлы (слева и снизу в ПСХЭ) отдают электроны, неметаллы (справа и сверху) — принимают. Между ними — амфотерные элементы.'},
{sec:'p25',html:'Амфотерный гидроксид (Zn(OH)₂, Al(OH)₃) реагирует и с кислотой (как основание), и со щёлочью (как кислота).'},
{sec:'p26',html:'Элементы одной группы образуют естественное семейство со сходными свойствами: щелочные металлы, галогены, инертные газы.'},
{sec:'p27',html:'Периодический закон: свойства элементов периодически зависят от заряда ядра их атомов.'},
{sec:'p28',html:'Номер периода = число электронных слоёв, номер группы = число внешних электронов (высшая валентность).'},
{sec:'final1',html:'Семейства, амфотерность, период и группа — повтори перед боссом.'}
];
window.POOLS = {
p24:[
{q:'Где в ПСХЭ расположены металлы?',opts:['Справа сверху','Слева и снизу','Только в группе VIII','В центре'],a:1,ex:'Металлы — слева и снизу от диагонали B–At.'},
{q:'Неметаллы при реакциях обычно…',opts:['Отдают электроны','Принимают электроны','Не реагируют','Образуют щёлочи'],a:1,ex:'Неметаллы принимают электроны (окислители).'},
{q:'Какой элемент проявляет двойственные (амфотерные) свойства?',opts:['Na','Cl','Zn','He'],a:2,ex:'Цинк — амфотерный элемент.'}
],
p25:[
{q:'Амфотерный гидроксид реагирует…',opts:['Только с кислотой','Только со щёлочью','И с кислотой, и со щёлочью','Ни с чем'],a:2,ex:'В этом и состоит амфотерность.'},
{q:'Zn(OH)₂ + 2HCl → … (Zn(OH)₂ ведёт себя как…)',opts:['Кислота','Основание','Соль','Оксид'],a:1,ex:'С кислотой — как основание: ZnCl₂ + H₂O.'},
{q:'Какого цвета осадок Zn(OH)₂?',opts:['Голубой','Белый','Бурый','Чёрный'],a:1,ex:'Zn(OH)₂ — белый студенистый осадок.'}
],
p26:[
{q:'Щелочные металлы — это элементы группы…',opts:['I','II','VII','VIII'],a:0,ex:'Li, Na, K — главная подгруппа I группы.'},
{q:'Галогены — это…',opts:['Li, Na, K','Be, Mg, Ca','F, Cl, Br, I','He, Ne, Ar'],a:2,ex:'Галогены — VII группа.'},
{q:'Инертные (благородные) газы почти не реагируют, потому что…',opts:['Они тяжёлые','Их внешний слой завершён','Они металлы','У них нет ядра'],a:1,ex:'Завершённый внешний электронный слой — устойчивость.'}
],
p27:[
{q:'В каком году открыт периодический закон?',opts:['1689','1769','1869','1969'],a:2,ex:'Д. И. Менделеев, 1869 год.'},
{q:'В основу первой системы Менделеев положил…',opts:['Заряд ядра','Относительную атомную массу','Число нейтронов','Радиус атома'],a:1,ex:'Тогда расположил по возрастанию атомной массы.'},
{q:'Современная формулировка: свойства зависят от…',opts:['Массы атома','Заряда ядра атома','Цвета вещества','Температуры'],a:1,ex:'Свойства периодичны по заряду ядра.'}
],
p28:[
{q:'Номер периода показывает число…',opts:['Протонов','Электронных слоёв','Нейтронов','Групп'],a:1,ex:'Номер периода = число электронных слоёв.'},
{q:'Номер группы (главной подгруппы) показывает число…',opts:['Нейтронов','Внешних электронов','Слоёв','Изотопов'],a:1,ex:'Число внешних электронов = высшая валентность.'},
{q:'Сколько всего периодов в ПСХЭ?',hint:'строки',unit:'',a:7,ex:'7 периодов.'}
],
final1:[
{q:'Цинк по свойствам — это…',opts:['Типичный металл','Типичный неметалл','Амфотерный элемент','Инертный газ'],a:2,ex:'Zn амфотерен.'},
{q:'К какому семейству относится хлор Cl?',opts:['Щелочные','Галогены','Инертные','ЩЗМ'],a:1,ex:'Cl — галоген (VII группа).'},
{q:'Год открытия периодического закона:',hint:'',unit:'',a:1869,ex:'1869.'},
{q:'Номер группы натрия Na (число внешних электронов):',hint:'I группа',unit:'',a:1,ex:'1 внешний электрон.'},
{q:'Сколько электронных слоёв у элемента 3-го периода?',hint:'= номер периода',unit:'',a:3,ex:'3 слоя.'},
{q:'Сколько внешних электронов у инертных газов (VIII группа)?',hint:'завершённый слой',unit:'',a:8,ex:'8 (у He — 2).'},
{q:'К какому семейству относится калий K?',opts:['Галогены','Щелочные металлы','Инертные','ЩЗМ'],a:1,ex:'K — щелочной металл (I группа).'} /*U5-extra*/
]
};
function rememberBox(items){ return '<div class="remember-box"><div class="remember-box-title"><svg class="ic" viewBox="0 0 24 24" style="width:15px;height:15px"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg> Запомни!</div><ul>'+items.map(function(t){return '<li>'+t+'</li>';}).join('')+'</ul></div>'; }
function qList(items){ return '<div class="section-title">Вопросы и задания</div><ol class="q-list">'+items.map(function(t){return '<li>'+t+'</li>';}).join('')+'</ol>'; }
function flag(title, help, inner){ return '<div class="flag-card"><div class="flag-title">'+title+'</div><div class="flag-help">'+help+'</div>'+inner+'</div>'; }
function wgt(title, inner){ return '<div class="wgt"><div class="wgt-h"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/></svg> '+title+'</div>'+inner+'</div>'; }
function hero(ph,label,title,formula,desc,tags){ return '<div class="para-hero ph-'+ph+'"><div class="ph-label">'+label+'</div><h2>'+title+'</h2>'+(formula?'<div class="ph-formula">'+formula+'</div>':'')+'<div class="ph-desc">'+desc+'</div>'+(tags?'<div class="ph-tags">'+tags.map(function(t){return '<span class="ph-tag">'+t+'</span>';}).join('')+'</div>':'')+'</div>'; }
window.BUILDERS = { p24:bp24, p25:bp25, p26:bp26, p27:bp27, p28:bp28, final1:bfinal };
function bp24(){ document.getElementById('p24-body').innerHTML =
hero(3,'§ 24 · Глава 2','Систематизация химических элементов','Me · неMe','Первые попытки навести порядок среди элементов: разделение на металлы и неметаллы.',['металлы','неметаллы','амфотерные'])
+makeCard('theory','Металлы и неметаллы','§24','<p>Элементы делят на <b>металлы</b> (отдают электроны, образуют основные оксиды и основания) и <b>неметаллы</b> (принимают электроны, образуют кислотные оксиды и кислоты). Граница условна — у диагонали B–Si–As–Te стоят <b>амфотерные</b> элементы (Be, Al, Zn).</p>')
+flag('Интерактивная ПСХЭ: металлы и неметаллы','Нажимай кнопки-режимы и кликай по элементам — увидишь, как распределены металлы, неметаллы и металлоиды.','<div id="c-pt-metals"></div>')
+rememberBox(['Металлы — слева и снизу, неметаллы — справа и сверху.','Амфотерные элементы — у диагонали.'])
+qList(['Назови три металла и три неметалла.','Почему граница между ними условна?'])
+secNav(null,'p25')+readButton('p24'); wireReadBtn('p24'); }
function bp25(){ document.getElementById('p25-body').innerHTML =
hero(9,'§ 25 · Глава 2','Понятие об амфотерности · Лаб. 3','Zn(OH)₂','Некоторые гидроксиды ведут себя двойственно — реагируют и с кислотами, и со щелочами.',['амфотерность','Zn(OH)₂','Лаб.3'])
+makeCard('theory','Амфотерность','§25','<p><b>Амфотерные</b> гидроксиды (Zn(OH)₂, Al(OH)₃, Be(OH)₂) проявляют свойства и оснований, и кислот:</p><p>как <b>основание</b>: Zn(OH)₂ + 2HCl → ZnCl₂ + 2H₂O<br>как <b>кислота</b>: Zn(OH)₂ + 2NaOH → Na₂[Zn(OH)₄]</p>')
+flag('Опыт: амфотерность Zn(OH)₂','Добавь к осадку кислоту или щёлочь — в обоих случаях он растворяется.','<div id="c-amph"></div>')
+makeCard('lab','Лабораторный опыт 3 · Получение гидроксида цинка',null,'<p>К раствору соли цинка прилей немного щёлочи — выпадет <b>белый осадок</b> Zn(OH)₂. Раздели на две пробирки: в одну добавь кислоту, в другую — избыток щёлочи. Осадок растворяется в обоих случаях — это и есть амфотерность.</p><p>ZnSO₄ + 2NaOH → Zn(OH)₂↓ + Na₂SO₄</p>')
+rememberBox(['Амфотерный = и основание, и кислота одновременно.','Zn(OH)₂ и Al(OH)₃ — главные примеры в 8 классе.'])
+qList(['Допиши: Al(OH)₃ + NaOH → ?','Как доказать амфотерность гидроксида цинка?'])
+secNav('p24','p26')+readButton('p25'); wireReadBtn('p25'); }
function bp26(){ document.getElementById('p26-body').innerHTML =
hero(4,'§ 26 · Глава 2','Естественные семейства элементов','группы','Элементы со схожими свойствами объединяются в семейства — это подсказало структуру системы.',['щелочные','галогены','инертные'])
+makeCard('theory','Семейства элементов','§26','<p>Элементы со сходными свойствами образуют <b>естественные семейства</b>:</p><ul><li><b>Щелочные металлы</b> (Li, Na, K, Rb, Cs) — очень активные, бурно реагируют с водой.</li><li><b>Щёлочноземельные</b> (Ca, Sr, Ba) — активные металлы.</li><li><b>Галогены</b> (F, Cl, Br, I) — активные неметаллы.</li><li><b>Инертные газы</b> (He, Ne, Ar) — почти не реагируют.</li></ul>')
+flag('ПСХЭ: подсветка семейств','Нажми кнопку семейства — соответствующие элементы подсветятся в системе.','<div id="c-pt-fam"></div>')
+rememberBox(['Элементы одной группы — одно семейство.','Активность щелочных металлов растёт вниз по группе, галогенов — убывает.'])
+qList(['Назови все галогены.','Почему инертные газы малоактивны?'])
+secNav('p25','p27')+readButton('p26'); wireReadBtn('p26'); }
function bp27(){ document.getElementById('p27-body').innerHTML =
hero(5,'§ 27 · Глава 2','Периодический закон Д. И. Менделеева','1869','Открытие, изменившее химию: свойства элементов повторяются периодически.',['Менделеев','периодичность'])
+makeCard('theory','Периодический закон','§27','<p>В 1869 году <b>Д. И. Менделеев</b> расположил элементы по возрастанию относительной атомной массы и заметил: свойства повторяются через определённые промежутки — <b>периодически</b>.</p><div class="def-box">Современная формулировка: <b>свойства химических элементов и их соединений находятся в периодической зависимости от заряда ядра атомов</b>.</div><p>Менделеев даже предсказал свойства ещё не открытых элементов (галлий, германий) — и оказался прав!</p>')
+'<div class="insight-box"><div class="insight-title">Почему «периодический»</div><p>Двигаясь по периоду слева направо, металлические свойства ослабевают, неметаллические — усиливаются. В начале следующего периода всё повторяется снова.</p></div>'
+rememberBox(['Основа закона — заряд ядра (порядковый номер), а не масса.','Менделеев предсказал неоткрытые элементы по «пустым клеткам».'])
+qList(['Сформулируй периодический закон.','Что предсказал Менделеев благодаря своей системе?'])
+secNav('p26','p28')+readButton('p27'); wireReadBtn('p27'); }
function bp28(){ document.getElementById('p28-body').innerHTML =
hero(6,'§ 28 · Глава 2','Периодическая система химических элементов','период · группа','Графическое выражение закона: таблица из периодов и групп, по которой «читают» элемент.',['период','группа','подгруппа'])
+makeCard('theory','Структура системы','§28','<p><b>Период</b> — горизонтальная строка (всего 7). Номер периода = число электронных слоёв в атоме.<br><b>Группа</b> — вертикальный столбец (I–VIII). Номер группы = число внешних электронов = высшая валентность.<br>Группы делятся на <b>главную</b> (А) и <b>побочную</b> (Б) подгруппы.</p>')
+flag('ПСХЭ: периоды и группы','Подсвети период или группу — увидишь, как устроена система.','<div id="c-pt-struct"></div>')
+rememberBox(['Номер периода = число электронных слоёв.','Номер группы = число внешних электронов.','7 периодов, 8 групп (главные подгруппы).'])
+qList(['Сколько внешних электронов у элементов II группы?','В каком периоде элемент с тремя электронными слоями?'])
+secNav('p27','final1')+readButton('p28'); wireReadBtn('p28'); }
function bfinal(){ document.getElementById('final1-body').innerHTML =
hero('final','Финал главы 2','Босс: периодический закон','семейства · период · группа','Пять интегрированных задач по всей главе. Победи босса — ачивка «Периодический закон освоен».')
+makeCard('rule','Шпаргалка главы',null,'<div class="formula-grid"><div class="fcard"><h3>Период</h3><div class="main-f">= число слоёв</div></div><div class="fcard"><h3>Группа</h3><div class="main-f">= внешние e⁻</div></div><div class="fcard"><h3>Семейства</h3><div class="main-f">щелочные · галогены</div></div><div class="fcard highlight"><h3>Закон</h3><div class="main-f">периодичность по Z</div></div></div>')
+'<p style="margin:10px 0;color:var(--muted);font-size:.9rem">Реши все задачи — за каждую +5 XP, за победу — ачивка и бонус.</p>'
+'<div class="flag-card"><div class="flag-title">Карта связей понятий</div><div class="flag-help">Кликни по связи — увидишь, как понятия главы связаны.</div><div id="c-concept"></div></div>'+secNav('p28',null); }
</script>
</body>
</html>