Files
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

356 lines
50 KiB
HTML
Raw Permalink 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 · Глава 1 · «Важнейшие классы неорганических соединений»</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>
/* Глава 1 — teal-палитра */
:root{ --pri:#0d9488; --pri-d:#0f766e; --pri-l:#2dd4bf; --pri-soft:#ccfbf1; --sec-acc:#0d9488; --sec-acc-d:#0f766e; --sec-acc-soft:#ccfbf1; }
html.dark{ --bg:#0c1a18; --card:#102825; --card-soft:#13302c; --text:#ccfbf1; --muted:#7fd8c8; --border:#1d463f; --pri-soft:rgba(13,148,136,.2); --sec-acc-soft:rgba(13,148,136,.2); }
.hdr{background:linear-gradient(110deg,#134e4a 0%,#0d9488 55%,#2dd4bf 100%)}
.hdr::before{content:'ГЛАВА 1'}
</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_ch1_widgets.js" defer></script>
<script src="/js/chem8_engine.js" defer></script>
</head>
<body>
<header class="hdr">
<div class="hdr-row">
<div>
<h1>Химия 8 · Глава 1</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>Оксиды, кислоты, основания и соли связаны между собой превращениями. Научившись узнавать класс вещества по формуле и предсказывать его реакции, ты сможешь «читать» химию как язык.</p>
<div class="hero-row">
<button class="btn-primary" onclick="goTo('p10')"><svg class="ic" viewBox="0 0 24 24"><polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/></svg> Начать § 10</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-p10" class="sec"><div class="sec-header"><span class="sec-num">§ 10</span><h2 class="sec-h">Оксиды. Состав и классификация</h2></div><div id="p10-body"></div></section>
<section id="sec-p11" class="sec"><div class="sec-header"><span class="sec-num">§ 11</span><h2 class="sec-h">Химические свойства оксидов</h2></div><div id="p11-body"></div></section>
<section id="sec-p12" class="sec"><div class="sec-header"><span class="sec-num">§ 12</span><h2 class="sec-h">Получение и применение оксидов</h2></div><div id="p12-body"></div></section>
<section id="sec-p13" class="sec"><div class="sec-header"><span class="sec-num">§ 13</span><h2 class="sec-h">Кислоты. Состав и классификация</h2></div><div id="p13-body"></div></section>
<section id="sec-p14" class="sec"><div class="sec-header"><span class="sec-num">§ 14</span><h2 class="sec-h">Химические свойства кислот</h2></div><div id="p14-body"></div></section>
<section id="sec-p15" class="sec"><div class="sec-header"><span class="sec-num">§ 15</span><h2 class="sec-h">Получение и применение кислот</h2></div><div id="p15-body"></div></section>
<section id="sec-p16" class="sec"><div class="sec-header"><span class="sec-num">§ 16</span><h2 class="sec-h">Основания</h2></div><div id="p16-body"></div></section>
<section id="sec-p17" class="sec"><div class="sec-header"><span class="sec-num">§ 17</span><h2 class="sec-h">Химические свойства оснований</h2></div><div id="p17-body"></div></section>
<section id="sec-p18" class="sec"><div class="sec-header"><span class="sec-num">§ 18</span><h2 class="sec-h">Получение оснований · Лаб. 1 · ПР 2</h2></div><div id="p18-body"></div></section>
<section id="sec-p19" class="sec"><div class="sec-header"><span class="sec-num">§ 19</span><h2 class="sec-h">Соли. Состав и классификация</h2></div><div id="p19-body"></div></section>
<section id="sec-p20" class="sec"><div class="sec-header"><span class="sec-num">§ 20</span><h2 class="sec-h">Химические свойства солей · Лаб. 2</h2></div><div id="p20-body"></div></section>
<section id="sec-p21" class="sec"><div class="sec-header"><span class="sec-num">§ 21</span><h2 class="sec-h">Получение и применение солей</h2></div><div id="p21-body"></div></section>
<section id="sec-p22" class="sec"><div class="sec-header"><span class="sec-num">§ 22</span><h2 class="sec-h">Взаимосвязь классов · ПР 3</h2></div><div id="p22-body"></div></section>
<section id="sec-p23" class="sec"><div class="sec-header"><span class="sec-num">§ 23</span><h2 class="sec-h">Решение расчётных задач</h2></div><div id="p23-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 класс» · Глава 1 · «Важнейшие классы неорганических соединений» · 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-ch1', themeKey:'chemistry8_theme', xpKey:'chemistry8_xp', progKey:'chemistry8_ch1_progress', achKey:'chemistry8_ch1_ach' };
window.PARAS = [
{id:'p10',num:'§ 10',name:'Оксиды. Классификация',sub:'осн/кисл/амф'},
{id:'p11',num:'§ 11',name:'Свойства оксидов',sub:'+ вода/кислота/щёлочь'},
{id:'p12',num:'§ 12',name:'Получение оксидов',sub:'горение · разложение'},
{id:'p13',num:'§ 13',name:'Кислоты. Классификация',sub:'основность'},
{id:'p14',num:'§ 14',name:'Свойства кислот',sub:'+ Me · ряд активности'},
{id:'p15',num:'§ 15',name:'Получение кислот',sub:'оксид + вода'},
{id:'p16',num:'§ 16',name:'Основания',sub:'щёлочи/нераств.'},
{id:'p17',num:'§ 17',name:'Свойства оснований',sub:'нейтрализация'},
{id:'p18',num:'§ 18',name:'Получение · Лаб.1 · ПР2',sub:'Cu(OH)₂↓'},
{id:'p19',num:'§ 19',name:'Соли. Классификация',sub:'растворимость'},
{id:'p20',num:'§ 20',name:'Свойства солей · Лаб.2',sub:'РИО · соль+Me'},
{id:'p21',num:'§ 21',name:'Получение солей',sub:'способы'},
{id:'p22',num:'§ 22',name:'Связь классов · ПР3',sub:'генетика'},
{id:'p23',num:'§ 23',name:'Расчётные задачи',sub:'по уравнениям'},
{id:'final1',num:'★',name:'Финал главы',sub:'босс · ачивка',final:true}
];
window.ACH_LABELS = { start:'Начало главы 1!', final1_tasks:'Классы веществ покорены!' };
['p10','p11','p12','p13','p14','p15','p16','p17','p18','p19','p20','p21','p22','p23'].forEach(function(id){ window.ACH_LABELS[id+'_done']=id.toUpperCase()+' изучен!'; });
window.SIDEBARS = {
p10:{title:'§10 Оксиды',rows:[['Оксид','ЭₓOᵧ, кислород 2'],['Основные','оксиды металлов'],['Кислотные','оксиды неметаллов'],['Амфотерные','ZnO, Al₂O₃']]},
p11:{title:'§11 Свойства',rows:[['Осн. оксид','+ кислота, + вода'],['Кисл. оксид','+ щёлочь, + вода'],['Соль','продукт + H₂O']]},
p12:{title:'§12 Получение',rows:[['Горение','S + O₂ → SO₂'],['Разложение','CaCO₃ → CaO + CO₂']]},
p13:{title:'§13 Кислоты',rows:[['Кислота','HₓAc'],['Бескислородные','HCl, H₂S'],['Кислородсод.','H₂SO₄, HNO₃'],['Основность','число H']]},
p14:{title:'§14 Свойства кислот',rows:[['+ Me','до H в ряду → H₂↑'],['+ осн. оксид','соль + вода'],['+ основание','нейтрализация'],['Индикатор','лакмус → красный']]},
p15:{title:'§15 Получение',rows:[['Кисл. оксид + вода','SO₃+H₂O→H₂SO₄'],['Соль + кислота','']]},
p16:{title:'§16 Основания',rows:[['Основание','Me(OH)ₙ'],['Щёлочи','NaOH, KOH, Ba(OH)₂'],['Нерастворимые','Cu(OH)₂, Fe(OH)₃'],['Фенолфталеин','малиновый в щёлочи']]},
p17:{title:'§17 Свойства',rows:[['Нейтрализация','+ кислота → соль+H₂O'],['+ кисл. оксид','соль + вода'],['Разложение','Cu(OH)₂ → CuO+H₂O']]},
p18:{title:'§18 Получение',rows:[['Щёлочь','Me + вода'],['Нераств.','щёлочь + соль'],['Лаб.1','Cu(OH)₂↓ голубой']]},
p19:{title:'§19 Соли',rows:[['Соль','катион металла + анион'],['Средние','NaCl, CaCO₃'],['Растворимость','таблица']]},
p20:{title:'§20 Свойства',rows:[['РИО','↓ ↑ H₂O'],['Соль + Me','активнее вытесняет'],['Лаб.2','соль + металл']]},
p21:{title:'§21 Получение',rows:[['Кислота+основание',''],['Металл+кислота',''],['Оксид+кислота','']]},
p22:{title:'§22 Связь',rows:[['Металл','→ оксид → основание → соль'],['Неметалл','→ оксид → кислота → соль']]},
p23:{title:'§23 Расчёты',rows:[['Алгоритм','m→n→n→m'],['По уравнению','мольное отношение']]},
final1:{title:'Финал главы 1',rows:[['§§1023','все классы'],['Награда','ачивка + XP']]}
};
window.TIPS = [
{sec:'p10',html:'Оксид — соединение элемента с кислородом (степень окисления −2). Оксиды металлов чаще основные, неметаллов — кислотные.'},
{sec:'p11',html:'Основный оксид реагирует с кислотой, кислотный — со щёлочью. Оба могут давать соль.'},
{sec:'p12',html:'Оксиды получают горением простых веществ и разложением солей/оснований.'},
{sec:'p13',html:'Основность кислоты = число атомов H, способных замещаться металлом (HCl — одноосновная, H₂SO₄ — двухосновная).'},
{sec:'p14',html:'Металлы ДО водорода в ряду активности вытесняют H₂ из растворов кислот; после — нет.'},
{sec:'p15',html:'Кислородсодержащие кислоты получают: кислотный оксид + вода. Например, SO₃ + H₂O → H₂SO₄.'},
{sec:'p16',html:'Растворимые основания — щёлочи (NaOH, KOH, Ba(OH)₂). Фенолфталеин в щёлочи становится малиновым.'},
{sec:'p17',html:'Реакция нейтрализации: основание + кислота → соль + вода.'},
{sec:'p18',html:'Нерастворимое основание получают: щёлочь + соль. Cu(OH)₂ — голубой осадок.'},
{sec:'p19',html:'Растворимость соли определяют по таблице. Нерастворимая соль выпадает в осадок.'},
{sec:'p20',html:'Реакции ионного обмена идут, если образуется осадок ↓, газ ↑ или вода. Металл вытесняет из соли менее активный металл.'},
{sec:'p21',html:'Соли получают многими способами: кислота+основание, металл+кислота, оксид+кислота, соль+соль и др.'},
{sec:'p22',html:'Генетическая связь: металл → основный оксид → основание → соль; неметалл → кислотный оксид → кислота → соль.'},
{sec:'p23',html:'Расчёт по уравнению: найди n известного, по коэффициентам — n искомого, переведи в массу/объём.'},
{sec:'final1',html:'Собери всё: классификация, свойства, растворимость, ряд активности, расчёты по уравнениям.'}
];
window.POOLS = {
p10:[
{q:'Оксид — это…',opts:['Соединение двух неметаллов','Сложное вещество из двух элементов, один из которых кислород (с.о. −2)','Любое вещество с кислородом','Соль кислородной кислоты'],a:1,ex:'Оксид — бинарное соединение элемента с кислородом.'},
{q:'Какой из оксидов основный?',opts:['CO₂','SO₃','Na₂O','P₂O₅'],a:2,ex:'Na₂O — оксид активного металла, основный.'},
{q:'Амфотерный оксид — это…',opts:['Na₂O','CaO','ZnO','CO'],a:2,ex:'ZnO проявляет и основные, и кислотные свойства.'},
{q:'Несолеобразующий оксид:',opts:['CO','SO₂','CaO','Al₂O₃'],a:0,ex:'CO не образует солей — несолеобразующий.'}
],
p11:[
{q:'Основный оксид реагирует с…',opts:['Основанием','Кислотой','Другим основным оксидом','Инертным газом'],a:1,ex:'Основный оксид + кислота → соль + вода.'},
{q:'Кислотный оксид реагирует с…',opts:['Кислотой','Щёлочью','Кислотным оксидом','Металлом'],a:1,ex:'Кислотный оксид + щёлочь → соль + вода.'},
{q:'Продукт реакции CaO + H₂O:',opts:['CaCO₃','Ca(OH)₂','CaCl₂','CaO₂'],a:1,ex:'Основный оксид активного металла + вода → щёлочь.'}
],
p12:[
{q:'Каким способом получают оксиды?',opts:['Только электролизом','Горением простых веществ и разложением солей','Только из кислот','Только из щелочей'],a:1,ex:'Горение (S+O₂→SO₂) и разложение (CaCO₃→CaO+CO₂).'},
{q:'При разложении 1 моль CaCO₃ образуется … моль CO₂',hint:'1:1',unit:'моль',a:1,ex:'CaCO₃ → CaO + CO₂, отношение 1:1.'}
],
p13:[
{q:'Бескислородная кислота — это…',opts:['H₂SO₄','HNO₃','HCl','H₃PO₄'],a:2,ex:'HCl не содержит кислорода.'},
{q:'Основность серной кислоты H₂SO₄ равна…',hint:'число атомов H',unit:'',a:2,ex:'Два атома водорода → двухосновная.'},
{q:'Какого цвета лакмус в растворе кислоты?',opts:['Синий','Красный','Жёлтый','Бесцветный'],a:1,ex:'Лакмус в кислоте — красный.'}
],
p14:[
{q:'Какой металл вытесняет водород из соляной кислоты?',opts:['Cu','Ag','Zn','Au'],a:2,ex:'Zn стоит до H в ряду активности.'},
{q:'Реакция кислоты с основанием называется…',opts:['Разложения','Нейтрализации','Замещения','Горения'],a:1,ex:'Кислота + основание → соль + вода — нейтрализация.'},
{q:'Медь (Cu) с разбавленной HCl…',opts:['Бурно реагирует','Не реагирует (стоит после H)','Образует H₂','Растворяется с осадком'],a:1,ex:'Cu после водорода — H₂ не вытесняет.'}
],
p15:[
{q:'H₂SO₄ можно получить реакцией…',opts:['SO₃ + H₂O','SO₂ + H₂','S + H₂O','Na₂SO₄ + H₂O'],a:0,ex:'Кислотный оксид SO₃ + вода → серная кислота.'},
{q:'Какой оксид при растворении в воде даёт кислоту?',opts:['CaO','Na₂O','CO₂','MgO'],a:2,ex:'CO₂ + H₂O → H₂CO₃ (кислотный оксид).'}
],
p16:[
{q:'Щёлочь — это…',opts:['Любое основание','Растворимое в воде основание','Нерастворимое основание','Кислота'],a:1,ex:'Щёлочи — растворимые основания (NaOH, KOH...).'},
{q:'Нерастворимое основание:',opts:['NaOH','KOH','Cu(OH)₂','Ba(OH)₂'],a:2,ex:'Cu(OH)₂ нерастворим.'},
{q:'Фенолфталеин в растворе щёлочи становится…',opts:['Красным','Малиновым','Жёлтым','Синим'],a:1,ex:'В щёлочи фенолфталеин малиновый.'}
],
p17:[
{q:'Продукты реакции NaOH + HCl:',opts:['NaCl + H₂','NaCl + H₂O','Na₂O + HCl','NaH + ClOH'],a:1,ex:'Нейтрализация: NaCl + H₂O.'},
{q:'При нагревании Cu(OH)₂ разлагается на…',opts:['Cu + H₂O','CuO + H₂O','CuO + H₂','Cu + O₂'],a:1,ex:'Cu(OH)₂ → CuO + H₂O.'}
],
p18:[
{q:'Cu(OH)₂ в лаборатории получают реакцией…',opts:['Cu + H₂O','CuSO₄ + NaOH','CuO + H₂O','Cu + NaOH'],a:1,ex:'Соль + щёлочь → нерастворимое основание Cu(OH)₂↓.'},
{q:'Какого цвета осадок Cu(OH)₂?',opts:['Белый','Голубой','Бурый','Чёрный'],a:1,ex:'Гидроксид меди(II) — голубой осадок.'}
],
p19:[
{q:'Соль — это…',opts:['Оксид металла','Продукт замещения H кислоты на металл','Гидроксид','Простое вещество'],a:1,ex:'В соли водород кислоты замещён металлом.'},
{q:'Какая соль нерастворима в воде?',opts:['NaCl','KNO₃','BaSO₄','CaCl₂'],a:2,ex:'BaSO₄ — нерастворим (см. таблицу).'},
{q:'Все нитраты (NO₃⁻)…',opts:['Нерастворимы','Растворимы','Малорастворимы','Разлагаются водой'],a:1,ex:'Нитраты растворимы все.'}
],
p20:[
{q:'Реакция ионного обмена идёт, если образуется…',opts:['Только газ','Осадок ↓, газ ↑ или вода','Только осадок','Новая кислота'],a:1,ex:'Условие необратимости РИО.'},
{q:'Какой металл вытеснит медь из раствора CuSO₄?',opts:['Ag','Au','Fe','Hg'],a:2,ex:'Fe активнее Cu → вытесняет медь.'},
{q:'Реакция AgNO₃ + NaCl даёт осадок…',opts:['AgNO₃','NaCl','AgCl↓','NaNO₃'],a:2,ex:'AgCl — белый осадок ↓.'}
],
p21:[
{q:'Какой способ НЕ даёт соль?',opts:['Кислота + основание','Металл + кислота','Оксид + кислота','Два инертных газа'],a:3,ex:'Инертные газы не реагируют.'},
{q:'Zn + 2HCl даёт соль…',opts:['ZnO','ZnCl₂','Zn(OH)₂','ZnSO₄'],a:1,ex:'ZnCl₂ + H₂↑.'}
],
p22:[
{q:'Генетический ряд металла:',opts:['Me → кислота → соль','Me → основный оксид → основание → соль','Me → кислотный оксид → кислота','Me → соль → оксид'],a:1,ex:'Металл → осн. оксид → основание → соль.'},
{q:'Из чего можно получить кислоту в ряду неметалла?',opts:['Из основного оксида','Из кислотного оксида + вода','Из металла','Из щёлочи'],a:1,ex:'Кислотный оксид + вода → кислота.'}
],
p23:[
{q:'CaO + 2HCl → CaCl₂ + H₂O. Дано n(CaO)=0,5 моль. Найди n(CaCl₂).',hint:'1:1',unit:'моль',a:0.5,ex:'Отношение 1:1 → 0,5 моль.'},
{q:'Zn + H₂SO₄ → ZnSO₄ + H₂↑. Дано n(Zn)=2 моль. Найди V(H₂) при н.у.',hint:'n(H₂)=2; V=n·22,4',unit:'л',a:44.8,ex:'2·22,4=44,8 л.'},
{q:'2NaOH + H₂SO₄ → Na₂SO₄ + 2H₂O. Дано n(H₂SO₄)=0,5 моль. Найди n(NaOH).',hint:'2:1',unit:'моль',a:1,ex:'2·0,5=1 моль.'}
],
final1:[
{q:'Какой оксид кислотный?',opts:['CaO','Na₂O','SO₃','MgO'],a:2,ex:'SO₃ — оксид неметалла, кислотный.'},
{q:'Основность H₃PO₄ равна…',hint:'число H',unit:'',a:3,ex:'Три атома H — трёхосновная.'},
{q:'Какой металл НЕ вытесняет H₂ из кислоты?',opts:['Mg','Zn','Fe','Cu'],a:3,ex:'Cu стоит после H.'},
{q:'Реакция CuSO₄ + 2NaOH даёт осадок…',opts:['CuO','Cu(OH)₂↓','Na₂SO₄','Cu'],a:1,ex:'Cu(OH)₂ — голубой осадок ↓.'},
{q:'Дано: m(CaCO₃)=50 г, M=100. Найди n.',hint:'n=m/M',unit:'моль',a:0.5,ex:'50/100=0,5 моль.'},
{q:'Zn + 2HCl → ZnCl₂ + H₂↑. n(Zn)=1 моль. Найди V(H₂) н.у.',hint:'V=n·22,4',unit:'л',a:22.4,ex:'1·22,4=22,4 л.'},
{q:'Mr(Cu(OH)₂)?',hint:'64+2·(16+1)',unit:'',a:98,ex:'64+34=98.'},
{q:'Какого цвета осадок Fe(OH)₃?',opts:['Голубой','Бурый','Белый','Чёрный'],a:1,ex:'Fe(OH)₃ — бурый.'} /*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 wgt(title, inner){ return '<div class="wgt"><div class="wgt-h"><svg class="ic" viewBox="0 0 24 24"><path d="M4 7h16M4 12h16M4 17h10"/></svg> '+title+'</div>'+inner+'</div>'; }
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 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>'; }
function tube(o){ return (window.Chem8&&window.Chem8.testTube)?window.Chem8.testTube(o):''; }
window.BUILDERS = {
p10:bp10,p11:bp11,p12:bp12,p13:bp13,p14:bp14,p15:bp15,p16:bp16,p17:bp17,p18:bp18,p19:bp19,p20:bp20,p21:bp21,p22:bp22,p23:bp23,final1:bfinal
};
function bp10(){ document.getElementById('p10-body').innerHTML =
hero(1,'§ 10 · Глава 1','Оксиды. Состав и классификация','ЭₓOᵧ','Самый распространённый класс: соединения элементов с кислородом — от песка и воды до углекислого газа.',['оксид','классификация','амфотерность'])
+makeCard('theory','Что такое оксид','§10','<p><b>Оксид</b> — сложное вещество из двух элементов, один из которых — кислород в степени окисления −2 (Na₂O, CaO, CO₂, SO₃, H₂O).</p><p>Оксиды делят на <b>солеобразующие</b> (дают соли) и <b>несолеобразующие</b> (CO, N₂O, NO). Солеобразующие — на <b>основные</b> (оксиды металлов: Na₂O, CaO), <b>кислотные</b> (оксиды неметаллов: CO₂, SO₃, P₂O₅) и <b>амфотерные</b> (ZnO, Al₂O₃).</p>')
+flag('Классификатор оксидов','Перетащи (кликни чип, затем корзину) каждый оксид в свой класс и нажми «Проверить».','<div id="c-ox-cls"></div>')
+rememberBox(['Оксиды металлов чаще основные, неметаллов — кислотные.','Амфотерные: ZnO, Al₂O₃, Cr₂O₃ — ведут себя двойственно.','CO, NO, N₂O — несолеобразующие.'])
+qList(['Чем основный оксид отличается от кислотного?','Приведи по два примера оксидов каждого класса.'])
+secNav(null,'p11')+readButton('p10'); wireReadBtn('p10'); }
function bp11(){ document.getElementById('p11-body').innerHTML =
hero(2,'§ 11 · Глава 1','Химические свойства оксидов','оксид + … → соль','Как основные и кислотные оксиды реагируют с водой, кислотами и щелочами, образуя соли.',['+ вода','+ кислота','+ щёлочь'])
+makeCard('theory','Свойства оксидов','§11','<p><b>Основные оксиды:</b><br>• + вода (только активные металлы) → щёлочь: CaO + H₂O → Ca(OH)₂<br>• + кислота → соль + вода: CuO + 2HCl → CuCl₂ + H₂O</p><p><b>Кислотные оксиды:</b><br>• + вода → кислота: SO₃ + H₂O → H₂SO₄<br>• + щёлочь → соль + вода: CO₂ + 2NaOH → Na₂CO₃ + H₂O</p>')
+makeCard('example','Признак реакции',null,'<div class="tt-row"><div><div style="text-align:center">'+tube({color:'#dbeafe'})+'</div><div class="tt-cap">CuO + кислота → голубой раствор соли</div></div></div>')
+rememberBox(['Основный + кислотный оксид → соль (CaO + CO₂ → CaCO₃).','Не все оксиды реагируют с водой (CuO, Fe₂O₃ — нет).'])
+qList(['Допиши: SO₂ + NaOH → ?','С чем реагирует основный оксид CaO?'])
+secNav('p10','p12')+readButton('p11'); wireReadBtn('p11'); }
function bp12(){ document.getElementById('p12-body').innerHTML =
hero(3,'§ 12 · Глава 1','Получение и применение оксидов','S + O₂ → SO₂','Откуда берут оксиды и где их применяют — от извести до кремнезёма.',['горение','разложение','применение'])
+makeCard('theory','Способы получения','§12','<p>• <b>Горение</b> простых веществ: S + O₂ → SO₂; 2Cu + O₂ → 2CuO.<br>• <b>Разложение</b> солей и оснований: CaCO₃ →(t) CaO + CO₂↑; Cu(OH)₂ →(t) CuO + H₂O.</p><p><b>Применение:</b> CaO (негашёная известь) — в строительстве, SiO₂ — стекло, CO₂ — газировка и огнетушители.</p>')
+rememberBox(['Горение неметалла даёт кислотный оксид, металла — основный.','Карбонаты при нагревании разлагаются на оксид и CO₂.'])
+qList(['Напиши уравнение горения углерода.','Где применяют негашёную известь CaO?'])
+secNav('p11','p13')+readButton('p12'); wireReadBtn('p12'); }
function bp13(){ document.getElementById('p13-body').innerHTML =
hero(4,'§ 13 · Глава 1','Кислоты. Состав и классификация','HₓAc','Вещества с кислым вкусом и подвижными атомами водорода: как их различают и классифицируют.',['основность','индикатор'])
+makeCard('theory','Кислоты и их классификация','§13','<p><b>Кислота</b> — сложное вещество, в составе которого есть атомы водорода, способные замещаться металлом, и кислотный остаток.</p><p>По наличию кислорода: <b>бескислородные</b> (HCl, H₂S, HBr) и <b>кислородсодержащие</b> (H₂SO₄, HNO₃, H₃PO₄). По числу атомов H — <b>основность</b>: одноосновные (HCl), двухосновные (H₂SO₄), трёхосновные (H₃PO₄).</p>')
+flag('Классификатор кислот','Распредели кислоты по наличию кислорода.','<div id="c-acid-cls"></div>')
+wgt('Индикатор: кислая среда','<div id="c-acid-ind"></div>')
+rememberBox(['Основность = число замещаемых атомов H.','Лакмус в кислоте красный, метилоранж — розово-красный.'])
+qList(['Определи основность H₃PO₄.','Какие кислоты бескислородные?'])
+secNav('p12','p14')+readButton('p13'); wireReadBtn('p13'); }
function bp14(){ document.getElementById('p14-body').innerHTML =
hero(5,'§ 14 · Глава 1','Химические свойства кислот','+ Me · + оксид · + основание','Четыре главные реакции кислот и роль ряда активности металлов.',['ряд активности','нейтрализация'])
+makeCard('theory','Свойства кислот','§14','<p>Кислоты реагируют:<br>• с <b>металлами</b> (до H в ряду активности) → соль + H₂↑: Zn + 2HCl → ZnCl₂ + H₂↑<br>• с <b>основными оксидами</b> → соль + вода: CuO + H₂SO₄ → CuSO₄ + H₂O<br>• с <b>основаниями</b> (нейтрализация) → соль + вода<br>• с <b>солями</b> → новая соль + новая кислота (если ↓↑).</p>')
+flag('Ряд активности металлов','Кликни металл — узнаешь, вытесняет ли он водород из кислот и какие металлы вытесняет из солей.','<div id="c-acid-act"></div>')
+wgt('Индикатор: метилоранж','<div id="c-acid-ind2"></div>')
+rememberBox(['Металлы после H (Cu, Ag, Au) водород из кислот НЕ вытесняют.','Признак реакции с металлом — выделение пузырьков H₂↑.'])
+qList(['Будет ли реагировать Ag с HCl? Почему?','Допиши: Fe + HCl → ?'])
+secNav('p13','p15')+readButton('p14'); wireReadBtn('p14'); }
function bp15(){ document.getElementById('p15-body').innerHTML =
hero(6,'§ 15 · Глава 1','Получение и применение кислот','SO₃ + H₂O → H₂SO₄','Как получают кислоты и где их используют — от аккумуляторов до пищевой промышленности.',['получение','применение'])
+makeCard('theory','Получение кислот','§15','<p>• <b>Кислотный оксид + вода</b> → кислота: SO₃ + H₂O → H₂SO₄; CO₂ + H₂O → H₂CO₃.<br>• <b>Соль + сильная кислота</b> → новая кислота: BaCl₂ + H₂SO₄ → BaSO₄↓ + 2HCl.</p><p><b>Применение:</b> H₂SO₄ — «хлеб химии» (аккумуляторы, удобрения), HCl — в металлургии, H₃PO₄ — пищевая.</p>')
+rememberBox(['Бескислородные кислоты не получить «оксид + вода» — у них нет кислорода.','H₂SO₄ — одно из важнейших веществ промышленности.'])
+qList(['Из какого оксида получают угольную кислоту?','Где применяют серную кислоту?'])
+secNav('p14','p16')+readButton('p15'); wireReadBtn('p15'); }
function bp16(){ document.getElementById('p16-body').innerHTML =
hero(7,'§ 16 · Глава 1','Основания','Me(OH)ₙ','Гидроксиды металлов: растворимые щёлочи и нерастворимые основания.',['щёлочи','индикатор'])
+makeCard('theory','Основания','§16','<p><b>Основание</b> — сложное вещество из атома металла и гидроксогрупп OH. По растворимости: <b>щёлочи</b> (растворимые: NaOH, KOH, Ca(OH)₂, Ba(OH)₂) и <b>нерастворимые</b> (Cu(OH)₂, Fe(OH)₃, Mg(OH)₂).</p><p>Щёлочи изменяют окраску индикаторов: лакмус → синий, фенолфталеин → малиновый, метилоранж → жёлтый.</p>')
+flag('Классификатор оснований','Раздели основания на щёлочи и нерастворимые.','<div id="c-base-cls"></div>')
+wgt('Индикатор: фенолфталеин в щёлочи','<div id="c-base-ind"></div>')
+rememberBox(['Щёлочи — растворимые основания активных металлов (I–II групп).','Фенолфталеин — главный индикатор на щёлочь (малиновый).'])
+qList(['Назови три щёлочи.','Почему Cu(OH)₂ не относят к щелочам?'])
+secNav('p15','p17')+readButton('p16'); wireReadBtn('p16'); }
function bp17(){ document.getElementById('p17-body').innerHTML =
hero(8,'§ 17 · Глава 1','Химические свойства оснований','нейтрализация','Реакции щелочей и нерастворимых оснований: соль, вода и разложение при нагревании.',['+ кислота','+ оксид','разложение'])
+makeCard('theory','Свойства оснований','§17','<p>• <b>Нейтрализация:</b> основание + кислота → соль + вода: NaOH + HCl → NaCl + H₂O.<br>• Щёлочь + <b>кислотный оксид</b> → соль + вода: 2NaOH + CO₂ → Na₂CO₃ + H₂O.<br>• <b>Разложение</b> нерастворимых оснований при нагревании: Cu(OH)₂ →(t) CuO + H₂O.</p>')
+wgt('Индикатор: нейтрализация (двигай pH)','<div id="c-neutral-ind"></div>')
+rememberBox(['Реакция нейтрализации идёт всегда (образуется вода).','Щёлочи термически устойчивы, нерастворимые основания — разлагаются.'])
+qList(['Допиши: KOH + H₂SO₄ → ?','Что образуется при нагревании Fe(OH)₃?'])
+secNav('p16','p18')+readButton('p17'); wireReadBtn('p17'); }
function bp18(){ document.getElementById('p18-body').innerHTML =
hero(9,'§ 18 · Глава 1','Получение оснований · Лаб. 1 · ПР 2','CuSO₄ + 2NaOH → Cu(OH)₂↓','Как получают щёлочи и нерастворимые основания; лабораторный опыт и реакция нейтрализации.',['Лаб.1','ПР.2','осадок'])
+makeCard('theory','Получение оснований','§18','<p>• <b>Щёлочи:</b> активный металл + вода (2Na + 2H₂O → 2NaOH + H₂↑) или основный оксид + вода.<br>• <b>Нерастворимые основания:</b> щёлочь + соль → основание↓ + соль: CuSO₄ + 2NaOH → Cu(OH)₂↓ + Na₂SO₄.</p>')
+makeCard('lab','Лабораторный опыт 1 · Получение нерастворимого основания',null,'<p>К раствору соли меди(II) добавь раствор щёлочи — выпадает <b>голубой осадок</b> Cu(OH)₂.</p><div class="tt-row"><div><div style="text-align:center;color:#0891b2">'+tube({color:'#a5f3fc',precipitate:'#22d3ee',label:'Cu(OH)₂'})+'</div><div class="tt-cap">Голубой осадок Cu(OH)₂↓</div></div></div><p>CuSO₄ + 2NaOH → Cu(OH)₂↓ + Na₂SO₄</p>')
+makeCard('lab','Практическая работа 2 · Реакция нейтрализации',null,'<p>К щёлочи с фенолфталеином (малиновый) приливай кислоту — окраска исчезает в точке нейтрализации.</p>'+wgt('Двигай pH: исчезновение малиновой окраски','<div id="c-pr2-ind"></div>'))
+rememberBox(['Cu(OH)₂ — голубой, Fe(OH)₃ — бурый, Fe(OH)₂ — зеленоватый.','Нерастворимое основание получают только из щёлочи + соль.'])
+qList(['Как получить Fe(OH)₃ из соли железа(III)?','Что наблюдают в точке нейтрализации с фенолфталеином?'])
+secNav('p17','p19')+readButton('p18'); wireReadBtn('p18'); }
function bp19(){ document.getElementById('p19-body').innerHTML =
hero(1,'§ 19 · Глава 1','Соли. Состав и классификация','катион + анион','Соли — продукт встречи кислоты и основания; растворимость определяют по таблице.',['растворимость','классификация'])
+makeCard('theory','Соли','§19','<p><b>Соль</b> — сложное вещество из катионов металла (или NH₄⁺) и анионов кислотного остатка: NaCl, CaCO₃, CuSO₄. Это продукт замещения атомов H в кислоте на металл.</p><p>По составу: <b>средние</b> (NaCl, Na₂SO₄), <b>кислые</b> (NaHCO₃), <b>основные</b> (CuOHCl). Растворимость определяют по <b>таблице растворимости</b>.</p>')
+flag('Таблица растворимости','Кликни катион и анион — узнаешь, растворима ли соль и выпадет ли осадок.','<div id="c-salt-sol"></div>')
+rememberBox(['Все нитраты и соли натрия/калия растворимы.','Нерастворимая соль выпадает в осадок ↓.'])
+qList(['Растворим ли BaSO₄? А CaCO₃?','Из какой кислоты и основания получают Na₂SO₄?'])
+secNav('p18','p20')+readButton('p19'); wireReadBtn('p19'); }
function bp20(){ document.getElementById('p20-body').innerHTML =
hero(2,'§ 20 · Глава 1','Химические свойства солей · Лаб. 2','↓ ↑ H₂O','Реакции ионного обмена и вытеснение металлов из растворов солей.',['РИО','соль + Me','Лаб.2'])
+makeCard('theory','Свойства солей','§20','<p>• <b>Соль + соль</b> → две новые соли (если ↓): AgNO₃ + NaCl → AgCl↓ + NaNO₃.<br>• <b>Соль + щёлочь</b> → новое основание↓ + соль.<br>• <b>Соль + кислота</b> → новая соль + кислота (если ↓↑).<br>• <b>Соль + металл</b>: более активный металл вытесняет менее активный: Fe + CuSO₄ → FeSO₄ + Cu.</p>')
+flag('Таблица растворимости (предскажи осадок)','Проверь, образуется ли осадок в реакции обмена.','<div id="c-salt-sol2"></div>')
+flag('Ряд активности (соль + металл)','Кликни металл — увидишь, какие металлы он вытесняет из растворов солей.','<div id="c-salt-act"></div>')
+makeCard('lab','Лабораторный опыт 2 · Соль + металл',null,'<p>Опусти железный гвоздь в раствор CuSO₄ — он покрывается <b>красным налётом меди</b>, раствор бледнеет. Fe + CuSO₄ → FeSO₄ + Cu.</p>')
+rememberBox(['РИО идёт, если образуется осадок, газ или вода.','Металл вытесняет из соли только менее активный металл.'])
+qList(['Вытеснит ли серебро медь из CuSO₄?','Допиши: BaCl₂ + Na₂SO₄ → ?'])
+secNav('p19','p21')+readButton('p20'); wireReadBtn('p20'); }
function bp21(){ document.getElementById('p21-body').innerHTML =
hero(3,'§ 21 · Глава 1','Получение и применение солей','много способов','Соли получают десятком способов — это перекрёсток всех классов.',['способы','применение'])
+makeCard('theory','Способы получения солей','§21','<p>• кислота + основание (нейтрализация)<br>• кислота + основный оксид<br>• кислота + металл<br>• кислота + соль<br>• щёлочь + кислотный оксид<br>• соль + соль<br>• соль + металл<br>• металл + неметалл (2Na + Cl₂ → 2NaCl)</p><p><b>Применение:</b> NaCl — пища, Na₂CO₃ — стекло и мыло, CaCO₃ — строительство, KNO₃ — удобрения.</p>')
+rememberBox(['Соль — продукт реакции кислоты и основания (или их «родственников»).','Один и тот же продукт можно получить разными способами.'])
+qList(['Назови три способа получить CuSO₄.','Где применяют поваренную соль NaCl?'])
+secNav('p20','p22')+readButton('p21'); wireReadBtn('p21'); }
function bp22(){ document.getElementById('p22-body').innerHTML =
hero(4,'§ 22 · Глава 1','Взаимосвязь классов · ПР 3','генетическая связь','Все классы связаны цепочками превращений — от простого вещества до соли.',['генетика','ПР.3'])
+makeCard('theory','Генетическая связь','§22','<p><b>Ряд металла:</b> металл → основный оксид → основание → соль<br>Na → Na₂O → NaOH → NaCl</p><p><b>Ряд неметалла:</b> неметалл → кислотный оксид → кислота → соль<br>S → SO₃ → H₂SO₄ → Na₂SO₄</p><p>Эти ряды «встречаются» в солях — продукте реакции кислоты и основания.</p>')
+flag('Генетическая карта классов','Кликни по стрелке-переходу — увидишь реакцию-пример. Два ряда (металл и неметалл) сходятся в соли.','<div id="c-genetic"></div>')
+'<div class="insight-box"><div class="insight-title">Цепочка превращений</div><p>Ca → CaO → Ca(OH)₂ → CaCl₂. Попробуй записать уравнение каждого перехода!</p></div>'
+makeCard('lab','Практическая работа 3 · Экспериментальные задачи',null,'<p>По выданным реактивам осуществи цепочку превращений и докажи получение каждого вещества (например, получи из меди — оксид меди, затем соль).</p>')
+rememberBox(['Металл и неметалл — начала двух генетических рядов.','Соль — точка встречи кислотного и основного «миров».'])
+qList(['Запиши цепочку S → SO₂ → … → Na₂SO₃.','Какой класс стоит между оксидом металла и солью?'])
+secNav('p21','p23')+readButton('p22'); wireReadBtn('p22'); }
function bp23(){ document.getElementById('p23-body').innerHTML =
hero(5,'§ 23 · Глава 1','Решение расчётных задач','по уравнениям','Расчёты массы и объёма по уравнениям реакций классов неорганических веществ.',['расчёты','мольные отношения'])
+makeCard('rule','Алгоритм','§23','<ol><li>Записать и уравнять уравнение.</li><li>Найти n известного: n=m/M (или V/Vm).</li><li>По коэффициентам — n искомого.</li><li>Перейти к m=n·M (или V=n·Vm).</li></ol>')
+flag('Пошаговый решатель по уравнению','Выбери задачу и раскрывай решение по шагам.','<div class="fld"><label>Задача</label><select id="c-calc-pick"></select></div><div class="out" id="c-calc-out"></div><div class="fld"><button class="btn" id="c-calc-step">Следующий шаг ▸</button><button class="btn" id="c-calc-all">Показать всё</button></div>')
+rememberBox(['Мольное отношение берут из коэффициентов.','Для газов используют Vm=22,4 л/моль.'])
+secNav('p22','final1')+readButton('p23'); wireReadBtn('p23'); }
function bfinal(){ document.getElementById('final1-body').innerHTML =
hero('final','Финал главы 1','Босс: классы неорганических соединений','оксиды · кислоты · основания · соли','Шесть интегрированных задач на всю главу. Победи босса — получи ачивку «Классы веществ покорены».')
+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">HₓAc, основность</div></div><div class="fcard"><h3>Основания</h3><div class="main-f">Me(OH)ₙ</div></div><div class="fcard highlight"><h3>Соли</h3><div class="main-f">катион + анион</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('p23',null); }
</script>
</body>
</html>