Графика в HTML
методическая разработка по информатике и икт (10 класс)

Баскова Ирина Станиславовна
Опубликовано 18.01.2025 - 13:52 - Баскова Ирина Станиславовна

Проверьте свои знания по HTML с этим увлекательным и подробным тестом! ???? Этот тест включает в себя вопросы, которые помогут вам узнать о самых важных тегах, их атрибутах и правильном использовании. Пройдите тест и откройте для себя основы веб-разработки! 

Что в тесте?

  • Вопросы о базовых и специализированных тегах в HTML
  • Правильное использование атрибутов для тегов

Не упустите шанс стать экспертом по HTML! 

Скачать:

ВложениеРазмер
Microsoft Office document icon Практическая работа к уроку46.5 КБ
Office presentation icon Презентация к уроку1.08 МБ

Предварительный просмотр:

Лабораторная работа

«Размещение графики на Web-странице»

Задание 1.

  1. Создайте новую страницу в редакторе Блокнот.
  2. В элементе укажите название странички «Оформление цветом Web-страницы»</span></li><li class="c0 c4 li-bullet-0"><span class="c2">В начальном элементе <BODY> используйте соответствующий атрибут, чтобы сделать цвет фона странички черным.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">Сделайте надпись белым цветом «Спокойной ночи». Выровняйте ее по середине страницы. Размер шрифта 6.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">Вставьте горизонтальную линию красного цвета.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">Сделайте надпись желтого цвета «Приятных сновидений». Выровняйте ее по середине страницы. Размер шрифта 8.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">Вставьте горизонтальную линию синего цвета толщиной 10 пикселей длиной 50% от ширины экрана, и выровняйте ее по центру.</span></li></ol><p class="c0"><span class="c18">Задание 2.</span></p><ol class="c27 lst-kix_list_2-0 start" start="1"><li class="c0 c4 li-bullet-0"><span class="c2">Создайте новую страницу в редакторе Блокнот.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">В элементе <TITLE> укажите название странички «Размещение графики на Web-странице»</span></li><li class="c0 c4 li-bullet-0"><span class="c2">В теге <BODY> укажите любой цвет странички. </span></li><li class="c0 c4 li-bullet-0"><span class="c2">Разместите на страничке рисунок футбольного мяча файл . Для размещения изображения вам требуется указать путь к файлу в элементе <IMG>. Тогда элемент <IMG> будет выглядеть следующим образом: <IMG src=”; Выравнивание по центру.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">Сделайте подпись к рисунку «Футбольный мяч» с помощью атрибута alt. </span></li><li class="c0 c4 li-bullet-0"><span class="c2">Создайте рамку вокруг рисунка шириной 2 пикселя.</span></li><li class="c0 c4 li-bullet-0"><span class="c2">Над рисунком поместите заголовок «Мир футбола» самого большого размера и выровняйте его по центру страницы, задайте цвет.</span></li></ol><p class="c0"><span class="c9">Задание 3.</span></p><p class="c0"><span class="c2"> Выполнить страницу по образцу «КОШКИ»</span></p><p class="c15"><span class="c35">ПРИМЕЧАНИЕ Стандартные цвета</span></p><table class="c25"><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Белый </span></p></td><td class="c3 c26" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">white</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#FFFFFF</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Желтый </span></p></td><td class="c3 c17" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">yellow</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#FFFF00</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Зеленый </span></p></td><td class="c3 c12" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">green</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#008000</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Золотистый </span></p></td><td class="c3 c14" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">gold</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#FFD700</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Индиго </span></p></td><td class="c3 c32" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">indigo</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#4B0080</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Каштановый </span></p></td><td class="c3 c28" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">maroon</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#800000</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Красный </span></p></td><td class="c3 c39" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">red</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#FF0000</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Оливковый </span></p></td><td class="c3 c33" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">oliv</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#808000</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Пурпурный </span></p></td><td class="c3 c45" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">purple</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#800080</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Светло-зеленый </span></p></td><td class="c3 c24" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">lime</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#00FF00</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Серебристый </span></p></td><td class="c3 c34" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">silver</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#C0C0C0</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Серый </span></p></td><td class="c3 c21" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">gray</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#808080</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Сизый </span></p></td><td class="c3 c41" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">teal</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#008080</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Синий </span></p></td><td class="c3 c10" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">blue</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#0000FF</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Ультрамарин </span></p></td><td class="c3 c37" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">navy</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#000080</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Фиолетовый </span></p></td><td class="c3 c13" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">violet</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#EE80EE</span></p></td></tr><tr class="c5"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Фуксиновый </span></p></td><td class="c3 c38" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">fuchsia</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#FF00FF</span></p></td></tr><tr class="c20"><td class="c8" colspan="1" rowspan="1"><p class="c0"><span class="c1">Черный </span></p></td><td class="c3 c36" colspan="1" rowspan="1"><p class="c0"><span class="c1"> </span></p></td><td class="c3" colspan="1" rowspan="1"><p class="c7"><span class="c1">black</span></p></td><td class="c11" colspan="1" rowspan="1"><p class="c7"><span class="c1">#000000</span></p></td></tr></table><p class="c0 c30"><span class="c22"></span></p></div></div></div></div></div><br><h4>Предварительный просмотр:</h4><div align="center"><div id="presentation"><iframe src="https://docs.google.com/viewer?url=https://nsportal.ru/sites/default/files/2025/01/18/grafika.ppt&embedded=true"></iframe></div></div><br><div class="docpreview block marina-gradient-rounded-corners marina-title-rounded-green"><div class="inner clearfix"><div class="inner-wrapper"><div class="inner-inner"><h2 class="pane-title-center">Подписи к слайдам:</h2><div class="previewppt"><p class='slide-number'>Слайд 1</p>ПОДГОТОВКА К ЕГЭ 18.01.25<p class='slide-number'>Слайд 2</p><p>А1 (базовый уровень, время – 1 мин) Тема : Кодирование текстовой информации. Кодировка ASCII. Основные кодировки кириллицы. Автоматическое устройство осуществило перекодировку информационного сообщения на русском языке, первоначально записанного в 16-битном коде Unicode, в 8-битную кодировку КОИ-8. При этом информационное сообщение уменьшилось на 480 бит. Какова длина сообщения в символах? 1) 30 2) 60 3) 120 4) 480</p><p class='slide-number'>Слайд 3</p><p>А3 (базовый уровень, время – 1 мин) Тема: Системы счисления и двоичное представление информации в памяти компьютера. A4 Выполнение арифметических операций в двоичной, восьмеричной и шестнадцатеричной системах счисления. Как записывается число A 87 16 в восьмеричной системе счисления? 1) 435 8 2) 1577 8 3) 5207 8 4) 6400 8</p><p class='slide-number'>Слайд 4</p><p>А11 (базовый уровень, время – 1 мин) Тема: Кодирование и декодирование информации. Для кодирования букв А, В, С, D используются трехразрядные последовательные двоичные числа, начинающиеся с 1 (от 100 до 111 соответственно). Если таким способом закодировать последовательность символов CDAB и записать результат в шестнадцатеричном коде, то получится: 1) А52 16 2) 4С8 16 3) 13145 16 4) DE5 16</p><p class='slide-number'>Слайд 5</p><p>Добавление графики в WEB-документ 18 Январь, 2025 <number></p><p class='slide-number'>Слайд 6</p><p>Современные браузеры могут работать с различными форматами изображений, но наиболее предпочтительные – Для фотографий лучше использовать формат JPEG для рисунков и пиктограмм - GIF . GIF . JPEG</p><p class='slide-number'>Слайд 7</p><p>GIF – ( Graphics Interchange Format ) формат обмена графикой. Преимущества: Кодировка платформенно-независима ( Windows, Macintosh, Unics ). При создании файла применяется особая технология сжатия, которая существенно сокращает его размер, что очень ускоряет передачу его по сети. GIF -изображения легко анимировать, использовать прозрачность и всплывание. Недостаток: ограниченный набор цветов.  используется для пиктограмм и небольших картинок. 7 Кб 159 Кб 113 Кб</p><p class='slide-number'>Слайд 8</p><p>JPEG - ( Joint Photographic Expert Group ) – организация по стандартизации Преимущества: Кодировка платформенно-независима ( Windows, Macintosh, Unics ). При создании файла применяется особая технология сжатия, которая существенно сокращает его размер, что очень ускоряет передачу его по сети. Поддерживает десятки тысяч цветов 37 Кб 20 Кб</p><p class='slide-number'>Слайд 9</p><p>Тэг <IMG> - вставка изображений Атрибуты: Src - обязательный, значение- адрес изображения <img src = “dog.gif”> Обычно файлы с картинками помещают в ту же папку, что и сама страница или в отдельную папку: <img src = “pict/dog.gif”> alt – определяет альтернативный текст, который появляется на месте картинки в окне браузера, если вывод картинки невозможен или заблокирован пользователем . Значение alt – строка текста, длиной до 1024 символа. Кавычки обязательны. Alt= “ Собака на сене “ Этот текст также появиться в виде всплывающей подсказки, когда указатель мыши направлен на картинку. < IMG src =” boss 2. gif alt =”Портрет маленького джентльмена”></p><p class='slide-number'>Слайд 10</p><p>border - устанавливает или убирает (для гиперссылок) рамку вокруг изображения border = толщина рамки в пикселях border =0 – убрать рамку height, width – высота и ширина изображения в пикселях. Размеры могут быть больше или меньше реальных размеров изображения. Браузер автоматически масштабирует его. Значения можно указывать в % по отношению к окну. width = “100%” height= 20 – полоса на все окно шириной 20 пикселей. Если картинка не загрузилась, то на экране остается пустая область с заданными атрибутами height, width . hspace, vspace – задают расстояние в пикселях между картинкой и текстом по вертикали и горизонтали. < IMG src =” boss 2. gif width =”76” height =”121” border =”2” alt =”Портрет маленького джентльмена”></p><p class='slide-number'>Слайд 11</p><p>align – выравнивание . Положение изображения лучше всегда указывать явно. Значения: left, right – по левому или по правому краю. top – верхняя граница изображения устанавливается на уровне верхнего края самого высокого элемента в строке. middle – середина изображения выравнивается с серединой строки. bottom – (по умолчанию) нижний край изображения выравнивается с базовой линией текста.</p><p class='slide-number'>Слайд 12</p><p>Центрирование изображения Выровнять изображение по центру можно, только выделив его из текста тэгами абзацев, раздела <dir> или новой строки. 1 способ: Текст <br> <center> <img src = “dog.gif”> </center> Текст 2 способ: Текст <p align = center> <img src = “dog.gif”> </p> Текст</p><p class='slide-number'>Слайд 13</p><p>Обтекание изображения текстом Значения left и right атрибута align помещают изображение у левого или правого края документа. Затем браузер выводит оставшееся содержание документа в свободное пространство, смежное с изображением,  текст обтекает изображение. <IMG SRC="море.jpg" ALIGN=LEFT width=50% vspace=10 hspace=10> Душный зной над океаном, <BR> Небеса без облаков; <BR></p><p class='slide-number'>Слайд 14</p><p>Если в тэге <src> не указывать атрибут align=left или right , то текст на сайте располагается следующим образом: <H2 ALIGN=CENTER> Я.П. Полонский. Тишь </H2> <IMG SRC="море.jpg" width=50% vspace=10 hspace=10> Душный зной над океаном, <BR> Небеса без облаков; <BR></p><p class='slide-number'>Слайд 15</p><p>ЦВЕТ И ФОН СТРАНИЧКИ Если использовать рисунок в качестве «обоев» странички ( background ), то в теге < BODY > используем этот атрибут с указанием адреса рисунка «обоев». Пример : <BODY background=”wood.jpg”> < BODY bgcolor =" RED "> фон цвета</p><p class='slide-number'>Слайд 16</p><p>Можно поместить картинки одновременно по обеим сторонам документа. В этом случае картинки задаются перед текстом.</p><p class='slide-number'>Слайд 17</p><p><body bgcolor="#008080"> <p> <hr width="50%" size="5"> <p> <img src="1.jpg" width="25%" hspace="10" vspace="10" border="0" align="left"> <img src="3.jpg" width="25%" hspace="10" vspace="10" border="0" align="right"> <font size="+1" color="#C0C0C0"> <p align="center"> Кошки очень забавные животные. <br> Они создают уют в доме, радуют нас. <br clear="all"> Особенно приятно смотреть на маленьких котят. <p> <hr width="50%" size="5"> <p> </font> </body> </html></p><p class='slide-number'>Слайд 18</p><p>Пояснения: Обе картинки имеют значение атрибута width="25%" , но правая картинка заметно меньше левой. Это происходит потому, что 25% для правой картинку вычисляются от ширины, оставшейся после вывода левой картинки, т.е., от 75% ширины окна браузера. Для того, чтобы текст выводился после всех картинок, а не между ними, используем <br clear="all"></p><p class='slide-number'>Слайд 19</p><p>Если выводятся несколько картинок с одинаковым выравниванием ( left или right ), то следующее изображение позиционируется относительно предыдущего.</p><p class='slide-number'>Слайд 20</p><p><BODY bgcolor="#9900CC" text="#CCCCCC"> <font size=6> <br> <hr size=5> <br> <img src="1.BMP" align=left Width=200 height=200 hspace=20 vspace=20> Байкал <br> <img src="104.BMP" align=left Width=200 height=200 hspace=20 vspace=20> Тузик <br> <img src="11.BMP" align=left Width=200 height=200 hspace=20 vspace=20> Шарик <br clear=all> <hr size=5> <font> </BODY> </HTML></p><p class='slide-number'>Слайд 21</p><p>Итоги урока Сегодня мы узнали: 1. Как сделать фон всего документа 1. Как добавлять в документ изображения, 2. Способы обтекания картинок текстом.</p></div></div></div></div></div><br><div class="block marina-gradient-rounded-corners marina-title-rounded-green"><div class="inner clearfix"><div class="inner-wrapper"><div class="inner-inner"><h2 class="title block-title">По теме: методические разработки, презентации и конспекты</h2><div class="others"><h6><a href="/shkola/informatika-i-ikt/library/2011/12/04/yazyk-gipertekstovoy-razmetki-html">Язык гипертекстовой разметки HTML</a></h6><p class="search-excerpt">В презентации отражена история создания Интернета, приведены схемы организации Web-страниц. Подробно разобраны самые основные дескрипторы языка HTML....</p></div><div class="others"><h6><a href="/shkola/informatika-i-ikt/library/2012/01/30/osnovy-html-razrabotka-web-sayta-shest-urovney">Основы HTML. Разработка Web-сайта Шесть уровней ворженности (модуль) 11 класс</a></h6><p class="search-excerpt">Урок с использованием модульной технологии.На мой взгляд, использование модульной технологии позволяет: • повысить мотивацию учащихся в освоении не только знаний, но и ключевых компетенций; • строит...</p></div><div class="others"><h6><a href="/shkola/informatika-i-ikt/library/2012/02/03/rabochaya-programma-elektivnogo-kursa-k-proektu-cherez">Рабочая программа элективного курса "К проекту чeрез HTML"</a></h6><p class="search-excerpt">Данная рабочая программа составлена на основе авторской программы элективного  курса Т.М. Смирновой «К проекту через HTML». Программа имеет рецензию   Регионального экспертного совета...</p></div><div class="others"><img class="lazyload" data-src="/sites/default/files/pictures/2013/12/20/picture-370936-1387549812.jpg"><h6><a href="/shkola/informatika-i-ikt/library/2013/12/22/formatirovanie-teksta-i-razmeshchenie-grafiki-v-html">Форматирование текста и размещение графики в HTML.</a></h6><p class="search-excerpt">Цели урока:Дидактические:Познакомить учащихся с работой с изображениями в HTML. Развивающие:  Развивать познавательный интерес учащихся.Развивать  компьютерную грамотность учащихс...</p></div><div class="others"><h6><a href="/shkola/istoriya/library/2015/06/06/httpwww-prodlenka-orgmetodichkamypage-html-httpvideouroki">http://www.prodlenka.org/metodichka/mypage.html http://videouroki.net/filecom.php?fileid=98712464 http://videouroki.net/filecom.php?fileid=98711040 http://www.prodlenka.org/svidetelstvo.html http://videouroki.net/filecom.php?fileid=98710201 http://www.pro</a></h6><p class="search-excerpt">http://www.prodlenka.org/metodichka/mypage.htmlhttp://videouroki.net/filecom.php?fileid=98712464http://videouroki.net/filecom.php?fileid=98711040http://www.prodlenka.org/svidetelstvo.htmlhttp://videou...</p></div><div class="others"><h6><a href="/shkola/informatika-i-ikt/library/2018/10/16/grafika-v-html">Графика в HTML</a></h6><p class="search-excerpt">Графика Использование графики в html Для того чтобы вставить в Web-страницу изображение, необходимо либо нарисовать его, либо взять уже готовое. В любой программе рисования можно создать простое из...</p></div><div class="others"><h6><a href="/shkola/geografiya/library/2022/11/01/ssylki-na-moi-stati-i-publikatsii-v-zhivom-zhurnale-livejournal">Ссылки на мои статьи и публикации в Живом Журнале (LIVEJOURNAL): - 1. https://vladimir-shkola.livejournal.com/376.html 2. https://vladimir-shkola.livejournal.com/919.html</a></h6><p class="search-excerpt">Ссылки на мои  статьи и публикации в Живом Журнале (LIVEJOURNAL):https://vladimir-shkola.livejournal.com/376.htmlhttps://vladimir-shkola.livejournal.com/919.html...</p></div></div></div></div></div><br><div id="poisk-materialov" data-1="657"></div> <ul class="links inline"><li class="flag-like first last"><span><span class='like-tooltip flag-like'><a href='#'>Мне нравится</a><span class='flag-throbber'> </span></span></span></li> </ul> <div class="share_buttons clearfix">Поделиться:<div class="ya-share2" data-services="vkontakte,odnoklassniki,telegram,moimir" data-url="https://nsportal.ru/shkola/informatika-i-ikt/library/2025/01/18/grafika-v-html" data-title="графика в html" data-image="https://nsportal.ru/sites/default/files/pictures/2025/01/10/picture-1551499-1736506443.jpg"></div></div>  <div class="add-new-comment-button my-button-large"></div> </div> </div> </div> </div> </div> </div> </div><!-- /content-inner --> </div><!-- /content --> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div id="user_relationships_popup_form" class="user_relationships_ui_popup_form"></div><script src="/sites/default/files/advagg_js/js__S3bm1c7u9YzJnRE6QrV-HsLzADKLeupchfbrYg22kRU__S91yqV9ubUDMxzCK2GLBYdp1SFL3v48MFVTVZ3OSXjc__xK8RrS6Elbeb-uFsk6sQnqBT0LQWi9ruFM_5ORYTRxs.js" defer="defer"></script> <script src="/sites/default/files/advagg_js/js__hxOxF7aEdhvlSyCfiIODtjKmufwiFkLnYBgfAc3JU2U__Zvl8DJBWOfPQpMnqpLsqpzRLZD7C0PqUDMlY8RRkYVw__xK8RrS6Elbeb-uFsk6sQnqBT0LQWi9ruFM_5ORYTRxs.js" defer="defer"></script> <script src="/sites/default/files/advagg_js/js__c1zZbhXAByh0V-pY3W2l6b4e6e6URcR4okOH_epIox4__oVrjkf1Udl7K9Xgwtl5J3lSmv-cR7ynKeNmPgrmULSU__xK8RrS6Elbeb-uFsk6sQnqBT0LQWi9ruFM_5ORYTRxs.js" defer="defer"></script> <script defer src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.min.js" integrity="sha384-cn7l7gDp0eyniUwwAZgrzD06kc/tftFf19TOAs2zVinnD/C7E91j9yyk5//jjpt/" crossorigin="anonymous"></script> </body> </html> <!-- Page cached by Boost @ 2025-10-15 06:40:40, expires @ 2026-02-04 06:40:40, lifetime 3 месяца 3 недели --> <!-- cache/normal/nsportal.ru/shkola/informatika-i-ikt/library/2025/01/18/grafika-v-html_ -->