f7d27ecb91
§4 Относительная атомная масса (весы атомов: во сколько раз тяжелее), §5 Молекулы и простые вещества (галерея молекул O2/O3/H2/N2 шариками), §6 Сложные вещества (классификатор простое/сложное + галерея H2O/CO2/CH4/NH3). Теория, тренажёры задач. Тест: 8/8 pass. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
326 lines
39 KiB
HTML
326 lines
39 KiB
HTML
<!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>Химия 7 · Глава 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">
|
||
<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/chem7_svg.js" defer></script>
|
||
<script src="/js/chem7_ch1_widgets.js" defer></script>
|
||
<script src="/js/chem8_engine.js" defer></script>
|
||
</head>
|
||
<body>
|
||
|
||
<header class="hdr">
|
||
<div class="hdr-row">
|
||
<div>
|
||
<h1>Химия 7 · Глава 1</h1>
|
||
<div class="hdr-sub">Первоначальные химические понятия: вещество, атом, элемент, молекула, формула, валентность, реакция и уравнение</div>
|
||
</div>
|
||
<div class="hdr-side">
|
||
<a href="/textbook/chemistry-7" 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('p1')"><svg class="ic" viewBox="0 0 24 24"><polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/></svg> Начать § 1</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-p1" class="sec"><div class="sec-header"><span class="sec-num">§ 1</span><h2 class="sec-h">Химия — наука о веществах</h2></div><div id="p1-body"></div></section>
|
||
<section id="sec-p2" class="sec"><div class="sec-header"><span class="sec-num">§ 2</span><h2 class="sec-h">Чистые вещества и смеси</h2></div><div id="p2-body"></div></section>
|
||
<section id="sec-pr1" class="sec"><div class="sec-header"><span class="sec-num">ПР 1</span><h2 class="sec-h">Практическая работа: знакомство с лабораторией. Разделение смесей</h2></div><div id="pr1-body"></div></section>
|
||
<section id="sec-p3" class="sec"><div class="sec-header"><span class="sec-num">§ 3</span><h2 class="sec-h">Атомы. Химические элементы</h2></div><div id="p3-body"></div></section>
|
||
<section id="sec-p4" class="sec"><div class="sec-header"><span class="sec-num">§ 4</span><h2 class="sec-h">Относительная атомная масса химических элементов</h2></div><div id="p4-body"></div></section>
|
||
<section id="sec-p5" class="sec"><div class="sec-header"><span class="sec-num">§ 5</span><h2 class="sec-h">Молекулы. Простые вещества</h2></div><div id="p5-body"></div></section>
|
||
<section id="sec-p6" class="sec"><div class="sec-header"><span class="sec-num">§ 6</span><h2 class="sec-h">Сложные вещества</h2></div><div id="p6-body"></div></section>
|
||
<section id="sec-p7" class="sec"><div class="sec-header"><span class="sec-num">§ 7</span><h2 class="sec-h">Химическая формула</h2></div><div id="p7-body"></div></section>
|
||
<section id="sec-p8" class="sec"><div class="sec-header"><span class="sec-num">§ 8</span><h2 class="sec-h">Относительная молекулярная масса</h2></div><div id="p8-body"></div></section>
|
||
<section id="sec-p9" class="sec"><div class="sec-header"><span class="sec-num">§ 9</span><h2 class="sec-h">Валентность</h2></div><div id="p9-body"></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-lo1" class="sec"><div class="sec-header"><span class="sec-num">Лаб. 1</span><h2 class="sec-h">Лабораторный опыт: признаки протекания химических реакций</h2></div><div id="lo1-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-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">Интерактивный учебник «Химия — 7 класс» · Глава 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-7-ch1', themeKey:'chemistry7_theme', xpKey:'chemistry7_xp',
|
||
progKey:'chemistry7_ch1_progress', achKey:'chemistry7_ch1_ach', hubHref:'/textbook/chemistry-7' };
|
||
|
||
window.PARAS = [
|
||
{id:'p1', num:'§ 1', name:'Химия — наука о веществах', sub:'вещество · свойства'},
|
||
{id:'p2', num:'§ 2', name:'Чистые вещества и смеси', sub:'разделение смесей'},
|
||
{id:'pr1', num:'ПР 1', name:'Практическая работа', sub:'разделение смесей'},
|
||
{id:'p3', num:'§ 3', name:'Атомы. Химические элементы', sub:'символы элементов'},
|
||
{id:'p4', num:'§ 4', name:'Относительная атомная масса', sub:'$A_r$'},
|
||
{id:'p5', num:'§ 5', name:'Молекулы. Простые вещества', sub:'$O_2$, $H_2$'},
|
||
{id:'p6', num:'§ 6', name:'Сложные вещества', sub:'$H_2O$, $CO_2$'},
|
||
{id:'p7', num:'§ 7', name:'Химическая формула', sub:'индекс · состав'},
|
||
{id:'p8', num:'§ 8', name:'Относительная молекулярная масса', sub:'$M_r=\\sum A_r$'},
|
||
{id:'p9', num:'§ 9', name:'Валентность', sub:'H — I, O — II'},
|
||
{id:'p10', num:'§ 10', name:'Физические и химические явления', sub:'признаки реакций'},
|
||
{id:'lo1', num:'Лаб. 1', name:'Признаки реакций', sub:'опыт'},
|
||
{id:'p11', num:'§ 11', name:'Закон сохранения массы', sub:'уравнения'},
|
||
{id:'p12', num:'§ 12', name:'Составление уравнений', sub:'коэффициенты'},
|
||
{id:'final1', num:'★', name:'Финал главы', sub:'босс · ачивка', final:true}
|
||
];
|
||
|
||
window.ACH_LABELS = { start:'Начало главы 1!', p1_done:'§1 изучен!', p2_done:'§2 изучен!',
|
||
pr1_done:'Практическая работа 1 выполнена!', p3_done:'§3 изучен!',
|
||
p4_done:'§4 изучен!', p5_done:'§5 изучен!', p6_done:'§6 изучен!', final1_tasks:'Глава 1 пройдена!' };
|
||
window.SIDEBARS = {
|
||
p1:{ title:'Шпаргалка §1', rows:[['Вещество','то, из чего состоит тело'],['Тело','предмет из вещества'],['Свойства','цвет, запах, плотность, $t_{пл}$…']] },
|
||
p2:{ title:'Шпаргалка §2', rows:[['Чистое','постоянный состав'],['Смесь','2+ вещества'],['Разделение','по различию свойств']] },
|
||
pr1:{ title:'Практическая 1', rows:[['Цель','разделить смесь'],['Соль+песок','раствор → фильтр → выпаривание'],['ТБ','аккуратно с нагревом']] },
|
||
p3:{ title:'Шпаргалка §3', rows:[['Атом','мельчайшая частица'],['Элемент','атомы с одинаковым $Z$'],['Символ','H, O, Fe, Cu…']] },
|
||
p4:{ title:'Шпаргалка §4', rows:[['$A_r$','во сколько раз тяжелее'],['Эталон','$1/12$ массы $^{12}$C'],['Пример','$A_r(\\text{O})=16$']] },
|
||
p5:{ title:'Шпаргалка §5', rows:[['Молекула','частица из атомов'],['Простое','1 элемент: $O_2$, $H_2$'],['Атомность','$O_2$, $O_3$']] },
|
||
p6:{ title:'Шпаргалка §6', rows:[['Сложное','разные элементы'],['Примеры','$H_2O$, $CO_2$, $NH_3$'],['Состав','можно разложить']] }
|
||
};
|
||
window.TIPS = [
|
||
{ sec:'p1', html:'Тело — это <b>предмет</b> (гвоздь, стакан), а вещество — <b>то, из чего</b> он сделан (железо, стекло). Из одного вещества можно сделать много тел.' },
|
||
{ sec:'p2', html:'Способ разделения подбирают по тому, <b>чем различаются</b> вещества смеси: растворимостью, магнитными свойствами, температурой кипения, плотностью.' },
|
||
{ sec:'pr1', html:'Соль растворяется в воде, а песок — нет. Сначала отфильтруй песок, потом выпари воду — на дне останется соль.' },
|
||
{ sec:'p3', html:'Химический элемент определяется <b>зарядом ядра</b> (числом протонов) — это и есть порядковый номер $Z$.' },
|
||
{ sec:'p4', html:'$A_r$ показывает, во сколько раз масса атома больше $1/12$ массы атома углерода-12. $A_r(\\text{H})=1$, $A_r(\\text{O})=16$, $A_r(\\text{Fe})=56$.' },
|
||
{ sec:'p5', html:'<b>Простое</b> вещество — атомы одного элемента ($O_2$, $Fe$). Кислород $O_2$ и озон $O_3$ — разные простые вещества одного и того же элемента.' },
|
||
{ sec:'p6', html:'<b>Сложное</b> вещество образовано атомами <b>разных</b> элементов ($H_2O$ — водород и кислород) и может быть разложено на простые.' }
|
||
];
|
||
|
||
/* ── задачи (тренажёр) ── */
|
||
window.POOLS = {
|
||
p1:[
|
||
{q:'Что изучает химия?',opts:['Только движение тел','Вещества, их свойства и превращения','Только живые организмы','Звёзды и планеты'],a:1,ex:'Химия — наука о веществах, их свойствах и превращениях.'},
|
||
{q:'Что из перечисленного — физическое тело (а не вещество)?',opts:['Вода','Медь','Гвоздь','Кислород'],a:2,ex:'Гвоздь — предмет (тело); медь, вода, кислород — вещества.'},
|
||
{q:'«Железо» — это…',opts:['Физическое тело','Вещество','Смесь','Явление'],a:1,ex:'Железо — вещество, из которого можно сделать разные тела.'},
|
||
{q:'Какое из свойств НЕ является свойством вещества?',opts:['Цвет','Плотность','Растворимость','Номер дома'],a:3,ex:'Цвет, плотность, растворимость — свойства вещества; номер дома — нет.'}
|
||
],
|
||
p2:[
|
||
{q:'Смесь песка и воды — какая?',opts:['Однородная','Неоднородная','Чистое вещество','Раствор'],a:1,ex:'Песчинки видны и не растворяются — смесь неоднородная.'},
|
||
{q:'Как разделить раствор соли в воде, чтобы получить соль?',opts:['Фильтрованием','Выпариванием','Магнитом','Никак'],a:1,ex:'Вода испаряется при нагревании, соль остаётся.'},
|
||
{q:'Раствор сахара в воде — это…',opts:['Чистое вещество','Однородная смесь','Неоднородная смесь','Простое вещество'],a:1,ex:'Сахар растворён равномерно — однородная смесь (раствор).'},
|
||
{q:'Чем удобно разделить смесь железных опилок и серы?',opts:['Магнитом','Выпариванием','Перегонкой','Фильтрованием'],a:0,ex:'Железо притягивается магнитом, сера — нет.'}
|
||
],
|
||
p3:[
|
||
{q:'Атом — это…',opts:['Самое крупное тело','Мельчайшая химически неделимая частица','Смесь веществ','Молекула воды'],a:1,ex:'Атом — мельчайшая химически неделимая частица вещества.'},
|
||
{q:'Химический элемент — это…',opts:['Любая частица','Вид атомов с одинаковым зарядом ядра','Молекула','Смесь атомов'],a:1,ex:'Элемент определяется зарядом ядра (числом протонов).'},
|
||
{q:'Каков порядковый номер $Z$ кислорода?',hint:'число протонов в ядре',unit:'',a:8,ex:'У кислорода Z = 8.'},
|
||
{q:'Какой символ у железа?',opts:['Fe','Ir','F','Zn'],a:0,ex:'Железо — Fe (от лат. ferrum).'}
|
||
],
|
||
p4:[
|
||
{q:'Что показывает относительная атомная масса $A_r$?',opts:['Массу атома в граммах','Во сколько раз масса атома больше $1/12$ массы атома $^{12}$C','Число протонов','Число молекул'],a:1,ex:'$A_r$ — сравнение массы атома с $1/12$ массы атома углерода-12.'},
|
||
{q:'$A_r(\\text{S})=32$, $A_r(\\text{O})=16$. Во сколько раз атом серы тяжелее атома кислорода?',hint:'$32/16$',unit:'раза',a:2,ex:'$32/16=2$.'},
|
||
{q:'$A_r(\\text{Mg})=24$, $A_r(\\text{C})=12$. Во сколько раз атом магния тяжелее атома углерода?',hint:'$24/12$',unit:'раза',a:2,ex:'$24/12=2$.'},
|
||
{q:'Относительная атомная масса $A_r$…',opts:['Измеряется в граммах','Безразмерна','Измеряется в литрах','Равна числу нейтронов'],a:1,ex:'$A_r$ — безразмерная величина сравнения.'}
|
||
],
|
||
p5:[
|
||
{q:'Молекула $\\text{O}_2$ образует…',opts:['Сложное вещество','Простое вещество','Смесь','Раствор'],a:1,ex:'Атомы одного элемента — простое вещество.'},
|
||
{q:'Простое вещество — это вещество, образованное…',opts:['Атомами одного элемента','Атомами разных элементов','Только молекулами','Только смесями'],a:0,ex:'Простое — один вид атомов.'},
|
||
{q:'Кислород $\\text{O}_2$ и озон $\\text{O}_3$ — это…',opts:['Одно и то же вещество','Разные простые вещества одного элемента','Сложные вещества','Смесь газов'],a:1,ex:'Один элемент — кислород, но разные простые вещества.'},
|
||
{q:'Сколько атомов в молекуле озона $\\text{O}_3$?',hint:'смотри индекс',unit:'',a:3,ex:'Озон $O_3$ — три атома кислорода.'}
|
||
],
|
||
p6:[
|
||
{q:'Вода $\\text{H}_2\\text{O}$ — это…',opts:['Простое вещество','Сложное вещество','Смесь','Атом'],a:1,ex:'Атомы разных элементов (H и O) — сложное вещество.'},
|
||
{q:'Сложное вещество образовано…',opts:['Атомами одного элемента','Атомами разных элементов','Только смесью','Одним атомом'],a:1,ex:'Сложное — разные элементы.'},
|
||
{q:'Какое из веществ — простое?',opts:['$\\text{H}_2\\text{O}$','$\\text{CO}_2$','$\\text{N}_2$','$\\text{NH}_3$'],a:2,ex:'$N_2$ — один элемент (азот).'},
|
||
{q:'Сколько разных химических элементов в молекуле метана $\\text{CH}_4$?',hint:'углерод и водород',unit:'',a:2,ex:'C и H — два элемента.'}
|
||
]
|
||
};
|
||
|
||
/* ── вспомогательные конструкторы контента ── */
|
||
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>';
|
||
}
|
||
|
||
/* ── BUILDERS: реальные (Волна 1) + заглушки для остальных ── */
|
||
function build_p1(){
|
||
document.getElementById('p1-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">§ 1 · Химия 7</div><h2>Химия — наука о веществах</h2>'
|
||
+'<div class="ph-desc">С чего начинается химия: чем тело отличается от вещества и как химики изучают вещества.</div>'
|
||
+'<div class="ph-tags"><span class="ph-tag">вещество</span><span class="ph-tag">тело</span><span class="ph-tag">свойства</span></div></div>'
|
||
+makeCard('theory','Вещества и тела','§1','<p><b>Химия</b> — наука о веществах, их свойствах и превращениях. <b>Физическое тело</b> — это предмет (гвоздь, стакан, ложка). <b>Вещество</b> — то, из чего состоит тело (железо, стекло, вода).</p>'
|
||
+'<div class="def-box">Из <b>одного</b> вещества можно изготовить <b>много разных</b> тел: из стекла — стакан, колбу, линзу. И наоборот, одно тело может состоять из нескольких веществ.</div>')
|
||
+makeCard('theory','Свойства веществ','§1','<p>Каждое вещество узнают по его <b>свойствам</b>: цвет, запах, агрегатное состояние, плотность, температуры плавления и кипения, растворимость в воде, тепло- и электропроводность.</p>'
|
||
+'<p>По набору свойств одно вещество отличают от другого: например, медь — красная и проводит ток, а сера — жёлтая и ток не проводит.</p>')
|
||
+makeCard('rule','Наблюдение и эксперимент','§1','<p>Химия — <b>экспериментальная</b> наука. Главные методы — <b>наблюдение</b> и <b>опыт (эксперимент)</b>. Опыты проводят в химической лаборатории, используя оборудование: пробирки, колбы, стаканы, спиртовку, штатив. Работать нужно по <b>правилам техники безопасности</b>.</p>')
|
||
+wgt('Распредели: физическое тело или вещество?','<div id="p1-cls"></div>')
|
||
+rememberBox(['Тело — предмет; вещество — то, из чего он сделан.','Вещество узнают по свойствам (цвет, плотность, растворимость…).','Химия изучает вещества опытным путём в лаборатории.'])
|
||
+qList(['Чем тело отличается от вещества? Приведи примеры.','Назови 3 свойства, по которым можно отличить медь от серы.','Почему в лаборатории важно соблюдать правила безопасности?'])
|
||
+secNav(null,'p2')+readButton('p1');
|
||
wireReadBtn('p1');
|
||
}
|
||
|
||
function build_p2(){
|
||
document.getElementById('p2-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">§ 2 · Химия 7</div><h2>Чистые вещества и смеси</h2>'
|
||
+'<div class="ph-desc">Чем чистое вещество отличается от смеси и как смеси разделяют на составные части.</div>'
|
||
+'<div class="ph-tags"><span class="ph-tag">смесь</span><span class="ph-tag">однородная</span><span class="ph-tag">разделение</span></div></div>'
|
||
+makeCard('theory','Чистое вещество и смесь','§2','<p><b>Чистое вещество</b> имеет постоянный состав и постоянные свойства. <b>Смесь</b> состоит из двух и более веществ, и её свойства зависят от состава.</p>'
|
||
+'<div class="def-box"><b>Однородные</b> смеси: состав одинаков во всём объёме, частицы не видны (раствор соли или сахара в воде, воздух). <b>Неоднородные</b>: составные части видны (песок в воде, смесь железа и серы).</div>')
|
||
+makeCard('rule','Способы разделения смесей','§2','<p>Смеси разделяют, используя <b>различие свойств</b> веществ:</p>'
|
||
+'<ul><li><b>Фильтрование</b> — нерастворимое отделяют от жидкости.</li><li><b>Выпаривание</b> — выделяют растворённое вещество, испаряя воду.</li><li><b>Отстаивание</b> (делительная воронка) — несмешивающиеся жидкости разной плотности.</li><li><b>Перегонка (дистилляция)</b> — вещества с разной температурой кипения.</li><li><b>Действие магнитом</b> — если одно вещество притягивается.</li></ul>')
|
||
+makeCard('example','Разделение смеси соли и песка',null,'<div class="exa-step">1) Добавить воду — соль растворится, песок нет. 2) <b>Фильтрование</b> — песок останется на фильтре. 3) <b>Выпаривание</b> фильтрата — получим чистую соль.</div>')
|
||
+wgt('Подбери способ разделения смеси','<div id="p2-sep"></div>')
|
||
+rememberBox(['Чистое вещество — постоянный состав и свойства.','Смеси бывают однородные и неоднородные.','Способ разделения выбирают по различию свойств веществ.'])
|
||
+qList(['Приведи пример однородной и неоднородной смеси.','Как разделить смесь воды и растительного масла?','Почему смесь соли и песка нельзя разделить только фильтрованием?'])
|
||
+secNav('p1','pr1')+readButton('p2');
|
||
wireReadBtn('p2');
|
||
}
|
||
|
||
function build_pr1(){
|
||
document.getElementById('pr1-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">Практическая работа 1</div><h2>Знакомство с лабораторией. Разделение смесей</h2>'
|
||
+'<div class="ph-desc">Познакомиться с лабораторным оборудованием и разделить неоднородную смесь на чистые вещества.</div></div>'
|
||
+makeCard('lab','Оборудование и порядок работы',null,'<p><b>Оборудование:</b> стакан, стеклянная палочка, воронка с фильтром, фарфоровая чашка, спиртовка, штатив.</p>'
|
||
+'<ol><li>Рассмотри смесь поваренной соли и песка — она <b>неоднородная</b>.</li><li>Пересыпь смесь в стакан, добавь воды и размешай — соль растворится.</li><li><b>Профильтруй</b> смесь: песок останется на фильтре, раствор соли пройдёт.</li><li><b>Выпари</b> фильтрат в фарфоровой чашке — вода испарится, останется соль.</li><li>Сделай вывод: какие свойства позволили разделить смесь.</li></ol>'
|
||
+'<div class="note-safe"><svg viewBox="0 0 24 24"><path d="M12 9v4M12 17h.01"/><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z"/></svg> Со спиртовкой и горячей чашкой работай осторожно; не пробуй вещества на вкус.</div>')
|
||
+wgt('Тренажёр: выбери способ разделения','<div id="pr1-sep"></div>')
|
||
+secNav('p2','p3')+readButton('pr1');
|
||
wireReadBtn('pr1');
|
||
}
|
||
|
||
function build_p3(){
|
||
document.getElementById('p3-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">§ 3 · Химия 7</div><h2>Атомы. Химические элементы</h2>'
|
||
+'<div class="ph-desc">Из каких мельчайших частиц состоят вещества и что такое химический элемент.</div>'
|
||
+'<div class="ph-tags"><span class="ph-tag">атом</span><span class="ph-tag">элемент</span><span class="ph-tag">символ</span></div></div>'
|
||
+makeCard('theory','Атомы','§3','<p>Все вещества состоят из мельчайших частиц. <b>Атом</b> — мельчайшая химически неделимая частица вещества. Атомы очень малы: их нельзя увидеть даже в обычный микроскоп.</p>')
|
||
+makeCard('theory','Химические элементы','§3','<p><b>Химический элемент</b> — это вид атомов с одинаковым зарядом ядра. Каждый элемент имеет <b>название</b> и <b>символ</b> (знак): водород — $\\text{H}$, кислород — $\\text{O}$, железо — $\\text{Fe}$. Порядковый номер элемента $Z$ равен числу протонов в ядре его атомов.</p>'
|
||
+'<div class="def-box">Известно более 100 химических элементов. В земной коре больше всего атомов кислорода и кремния, а во Вселенной — водорода.</div>')
|
||
+wgt('Каталог элементов: клик → номер, название, $A_r$','<div class="el-grid" id="p3-el"></div><div class="el-info" id="p3-elinfo">Выбери элемент, чтобы увидеть его характеристики.</div>')
|
||
+wgt('Тренажёр: символ → название элемента','<div id="p3-drill"></div>')
|
||
+rememberBox(['Атом — мельчайшая химически неделимая частица.','Химический элемент — вид атомов с одинаковым зарядом ядра.','У каждого элемента есть символ и порядковый номер $Z$.'])
|
||
+qList(['Чем атом отличается от химического элемента?','Запиши символы водорода, кислорода, железа и меди.','Что показывает порядковый номер элемента?'])
|
||
+secNav('pr1','p4')+readButton('p3');
|
||
wireReadBtn('p3');
|
||
}
|
||
|
||
function build_p4(){
|
||
document.getElementById('p4-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">§ 4 · Химия 7</div><h2>Относительная атомная масса химических элементов</h2>'
|
||
+'<div class="ph-formula">$A_r(\\text{O}) = 16$</div>'
|
||
+'<div class="ph-desc">Как сравнивают массы атомов, которые невозможно взвесить по отдельности.</div>'
|
||
+'<div class="ph-tags"><span class="ph-tag">$A_r$</span><span class="ph-tag">а.е.м.</span></div></div>'
|
||
+makeCard('theory','Зачем нужна относительная масса','§4','<p>Атомы очень малы, их масса в граммах — крошечное число, с которым неудобно работать. Поэтому массы атомов <b>сравнивают</b> между собой. За единицу принята $\\tfrac{1}{12}$ массы атома углерода-12 — это <b>атомная единица массы</b> (а.е.м.).</p>')
|
||
+makeCard('rule','Относительная атомная масса','§4','<div class="def-box"><b>Относительная атомная масса</b> $A_r$ показывает, во сколько раз масса атома больше $\\tfrac{1}{12}$ массы атома углерода-12. Это <b>безразмерная</b> величина.</div>'
|
||
+'<p>Значения $A_r$ берут из периодической таблицы: $A_r(\\text{H})=1$, $A_r(\\text{C})=12$, $A_r(\\text{O})=16$, $A_r(\\text{S})=32$, $A_r(\\text{Fe})=56$.</p>')
|
||
+makeCard('example','Сравнение масс атомов',null,'<p>Во сколько раз атом серы тяжелее атома кислорода?</p><div class="exa-step">$\\dfrac{A_r(\\text{S})}{A_r(\\text{O})}=\\dfrac{32}{16}=2$ раза.</div>')
|
||
+wgt('Весы атомов: во сколько раз тяжелее','<div id="p4-bal"></div>')
|
||
+rememberBox(['$A_r$ — безразмерная величина.','Эталон — $1/12$ массы атома углерода-12.','Значения $A_r$ берут из периодической таблицы.'])
|
||
+qList(['Что принято за атомную единицу массы?','Во сколько раз атом магния ($A_r=24$) тяжелее атома углерода ($A_r=12$)?','Почему $A_r$ не имеет единиц измерения?'])
|
||
+secNav('p3','p5')+readButton('p4');
|
||
wireReadBtn('p4');
|
||
}
|
||
|
||
function build_p5(){
|
||
document.getElementById('p5-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">§ 5 · Химия 7</div><h2>Молекулы. Простые вещества</h2>'
|
||
+'<div class="ph-desc">Из чего состоят вещества и какие вещества называют простыми.</div>'
|
||
+'<div class="ph-tags"><span class="ph-tag">молекула</span><span class="ph-tag">простое вещество</span></div></div>'
|
||
+makeCard('theory','Молекулы','§5','<p><b>Молекула</b> — частица, состоящая из нескольких атомов, соединённых вместе. Многие вещества состоят из молекул: кислород — из молекул $\\text{O}_2$, вода — из молекул $\\text{H}_2\\text{O}$.</p>')
|
||
+makeCard('theory','Простые вещества','§5','<div class="def-box"><b>Простое вещество</b> образовано атомами <b>одного</b> химического элемента: $\\text{O}_2$, $\\text{H}_2$, $\\text{N}_2$, а также металлы — железо $\\text{Fe}$, медь $\\text{Cu}$.</div>'
|
||
+'<p>Один элемент может образовать <b>несколько</b> простых веществ. Например, элемент кислород образует кислород $\\text{O}_2$ и озон $\\text{O}_3$ — это разные простые вещества.</p>')
|
||
+wgt('Молекулы простых веществ','<div id="p5-gal"></div>')
|
||
+rememberBox(['Молекула — частица из нескольких атомов.','Простое вещество — атомы одного элемента.','Один элемент может давать разные простые вещества ($O_2$ и $O_3$).'])
|
||
+qList(['Что такое молекула? Приведи пример.','Чем простое вещество отличается от химического элемента?','Назови два простых вещества, образованных элементом кислород.'])
|
||
+secNav('p4','p6')+readButton('p5');
|
||
wireReadBtn('p5');
|
||
}
|
||
|
||
function build_p6(){
|
||
document.getElementById('p6-body').innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">§ 6 · Химия 7</div><h2>Сложные вещества</h2>'
|
||
+'<div class="ph-desc">Какие вещества называют сложными и чем они отличаются от простых.</div>'
|
||
+'<div class="ph-tags"><span class="ph-tag">сложное вещество</span><span class="ph-tag">состав</span></div></div>'
|
||
+makeCard('theory','Сложные вещества','§6','<div class="def-box"><b>Сложное вещество</b> образовано атомами <b>разных</b> химических элементов: вода $\\text{H}_2\\text{O}$ (водород и кислород), углекислый газ $\\text{CO}_2$, метан $\\text{CH}_4$, аммиак $\\text{NH}_3$.</div>'
|
||
+'<p>Сложные вещества можно <b>разложить</b> на простые. Например, при разложении воды получаются простые вещества — водород и кислород.</p>')
|
||
+makeCard('example','Простое или сложное?',null,'<p>$\\text{N}_2$ — атомы только азота → <b>простое</b>. $\\text{NH}_3$ — атомы азота и водорода → <b>сложное</b>.</p>')
|
||
+wgt('Распредели: простое или сложное вещество?','<div id="p6-cls"></div>')
|
||
+wgt('Молекулы сложных веществ','<div id="p6-gal"></div>')
|
||
+rememberBox(['Сложное вещество — атомы разных элементов.','Сложные вещества можно разложить на простые.','Число элементов в формуле подскажет: 1 — простое, 2+ — сложное.'])
|
||
+qList(['Чем сложное вещество отличается от простого?','Из каких элементов состоит углекислый газ $\\text{CO}_2$?','Приведи пример разложения сложного вещества на простые.'])
|
||
+secNav('p5','p7')+readButton('p6');
|
||
wireReadBtn('p6');
|
||
}
|
||
|
||
/* заглушки для ещё не наполненных § (фазы — следующие волны) */
|
||
(function(){
|
||
var P = window.PARAS, B = {};
|
||
function ph(p, prev, next){
|
||
return function(){
|
||
var el = document.getElementById(p.id + '-body'); if (!el) return;
|
||
el.innerHTML =
|
||
'<div class="para-hero"><div class="ph-label">' + p.num + ' · Химия 7</div><h2>' + p.name + '</h2>'
|
||
+ '<div class="ph-desc">Содержание этого ' + (p.final ? 'раздела' : 'параграфа') + ' готовится.</div></div>'
|
||
+ makeCard('theory', p.name, p.num,
|
||
'<p>Скоро здесь появятся теория, наглядные SVG-схемы и интерактивные тренажёры по теме «' + p.name + '». Пока доступна навигация по главе' + (p.final ? '.' : ' и отметка о прочтении.') + '</p>')
|
||
+ secNav(prev, next) + (p.final ? '' : readButton(p.id));
|
||
if (!p.final) wireReadBtn(p.id);
|
||
};
|
||
}
|
||
for (var i = 0; i < P.length; i++) {
|
||
B[P[i].id] = ph(P[i], i > 0 ? P[i-1].id : null, i < P.length-1 ? P[i+1].id : null);
|
||
}
|
||
window.BUILDERS = B;
|
||
})();
|
||
|
||
/* переопределяем заглушки реальными builder'ами Волны 1 */
|
||
window.BUILDERS.p1 = build_p1;
|
||
window.BUILDERS.p2 = build_p2;
|
||
window.BUILDERS.pr1 = build_pr1;
|
||
window.BUILDERS.p3 = build_p3;
|
||
window.BUILDERS.p4 = build_p4;
|
||
window.BUILDERS.p5 = build_p5;
|
||
window.BUILDERS.p6 = build_p6;
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|