Презентація "HTML. Форматування тексту"

Бібліотека Інформатика Матеріали до уроків
Про матеріал
Презентація "HTML. Форматування тексту" для використання у 9 класі. Містить основні поняття використання мови гіперстекстової розмітки та завдання за варіантами.
Перегляд файлу
Створення веб-сторінки за обраною темою на мові розмітки гіпертексту НТМLЧастина 1. Форматування тексту
Створення веб сторінки2 Відкрити програму БЛОКНОТВвести HTML-код:3. Зберегти файл з розширенням htm або html: Файл /Сохранить как… Index.html4. Запуск збереженого файлу:
Стилі шрифтів3<В> … </B> - напівжирного накреслення Щоб задати будь-яке зображення шрифту, використовуються стилі.<I> … </I> - курсивне накреслення <U> … </U> - підкреслений текст <TT> … </TT> — імітація шрифту друкарської машинки<S> … </S> - перекреслений текст <B> <I> Україна </I> </B>До одного текстового фрагменту можна застосовувати декілька стилів. Для цього слід пам’ятати правило вкладених тегів, згідно з яким їх потрібно закривати у зворотному до відкривання порядку.
Атрибути тегу <BODY>4<BODY BGCOLOR = #000000 TEXT = “red”> </BODY >атрибутатрибутзначеннязначеннявідкриваючий тегзакриваючийтег. BGCOLOR = #000000 – встановлення кольору фону. TEXT = “red” – задає колір тексту. BACKGROUND = “URL” – замість URL вказують адресу малюнка, який має бути тлом для сторінки. LINK = #0000 CD – визначає колір гіперпосилань у документіALINK = #7 FFF00 – задає колір гіперпосилань під час клацання. VLINK = #B22222 – задає колір переглянутих гіперпосилань<BODY BGCOLOR=green TEXT=red>….</BODY>
Формування абзаців і рядків5<P> абзац </P> - створення абзацу<BR> - розрив рядка<DIV> абзац </DIV> - створення розділу. При створенні Web-сторінок потрібно прагнути до лаконічних текстів, які чітко розділені на абзаци. Для створення абзацу у мові HTML передбачено вико­ристання тегів. Втім, кінцевий тег </Р> в елементі абзацу не є обов'язковим. Для розриву рядка застосовується тег Цей тег є порожнім елементом, що змушує браузер перевести текст на новий рядок. Теги <ВR> зручні при оформленні поштових адрес, наборі віршів тощо. Для структуризації тексту в HTML-документах використовуються розділи, що задаються тегами. Характерною ознакою елементів DIV є наявність порожнього рядка перед ними.
Задання заголовків6 Заголовки поділяють HTML-документ на логічно закінчені блоки. Завдяки заголовкам відвідувач Web-сторінки може отримати уявлення про її вміст. Для задания заголовків використовуються парні теги <Нi>…</Нi>. Усього передбачено 6 рівнів заголовків:<H1>Заголовок</Н1> - заголовок 1-го рівня, найвищого рівня<H2>Заголовок</Н2> - заголовок 2-го рівня<H3>Заголовок</Н3> - заголовок 3-го рівня<H4>Заголовок</Н4> - заголовок 4-го рівня<H5>Заголовок</Н5> - заголовок 5-го рівня<H6>Заголовок</Н6> - заголовок 6-го рівня, найменшого розміру
Горизонтальна лінія7<HR> - встановлення горизонтальної лініїГоризонтальна лінія – це графічний елемент HTML-документа, який має довжину, товщину та колір. Для створення ліній призначено елемент: Зовнішній вигляд ліній можна змінити за допомогою атрибутів тегу <HR> :noshade – суцільна лінія без тіні (<HR noshade>) Align = “значення” – тип вирівнювання лінії на сторінціЦей атрибут може набувати значень: left, right, center.width = “значення” – ширина лінії у пікселях або відсоткахsize = “значення” – товщина лінії в діапазоні від 1 до 175 пікселівcolor = “значення” – колір лінії (<HR color=)
" title="Горизонтальна лінія7
- встановлення горизонтальної лініїГоризонтальна лінія – це графічний елемент HTML-документа, який має довжину, товщину та колір. Для створення ліній призначено елемент: Зовнішній вигляд ліній можна змінити за допомогою атрибутів тегу
:noshade – суцільна лінія без тіні (
) Align = “значення” – тип вирівнювання лінії на сторінціЦей атрибут може набувати значень: left, right, center.width = “значення” – ширина лінії у пікселях або відсоткахsize = “значення” – товщина лінії в діапазоні від 1 до 175 пікселівcolor = “значення” – колір лінії (
)
">
Вирівнювання абзаців8 Абзаци, що задаються тегом <Р>, розділи <DIV> і заголовки <Нi>, за умовчанням вирів­нюються по лівому краю сторінки. Змінити тип вирівнювання можна за допомогою атрибута Align : Align = " title="Вирівнювання абзаців8 Абзаци, що задаються тегом <Р>, розділи
і заголовки <Нi>, за умовчанням вирів­нюються по лівому краю сторінки. Змінити тип вирівнювання можна за допомогою атрибута Align : Align = "center" – вирівнювання по центру. Align ="left" – по лівому краю сторінки. Align ="right" – по правому краю сторінки. Align ="justify" – рівномірно розташувати по ширині вікна. Наприклад, вирівнювання абзацу по центру:<Р Align = "center">">
Форматування символів 9<FONT> текст </FONT> - зміна шрифту. Параметри шрифту, який використовується для відображення тексту на Web-сторінках, найпростіше визначити за допомогою елеме­нта. Для цього елемента передбачені такі атрибути: size = “значення” – розмір шрифтуcolor = “значення” – колір шрифтуface = “значення” – гарнітура шрифту або список шрифтів. Розмір шрифту виражається у відносних одиницях, що записуються цілими числами від 1 до 7. За замовчуванням використовується основний шрифт, розмір якого дорівнює 3. Колір задається англійською назвою або кодом. Код – послідов­ність 3 пар символів. Кожна пара – це шістнадцяткове значення насиченості (яскравості) заданого кольору одним з 3 основних кольорів (червоного, зеленого, синього – модель RGB) в діапазоні від нуля (00) до 255 (FF). В атрибуті face як значення допустимо вказувати декілька гарнітур шрифтів, відокремлюючи їх комою. Для відображення тексту браузер застосує одну із зазначених гарнітур, ім’я якої першою буде збігатися з наявною в наборі гарнітур шрифту браузера.
Стилі шрифтів10<SUP> … </SUP> – верхній індекс (S=Pi*R<SUP>2</SUP>)<SUB> … </SUB> – нижній індекс (H<SUB>2</SUB>O)<SMALL> … </ SMALL > – зменшення розміру шрифту<BIG> … </ BIG > – збільшення розміру шрифту<MARQUEE> … </ MARQUEE > – «рухомий рядок»Є й інші теги, які можна застосовувати для зміни параметрів тексту. Розмір символів збільшується (зменшується) на одиницю відносно поточного рівня. Для відображення індексів в HTML передбачено наступні теги. Цікавого оформлення веб-сторінці надає пара тегів. Вони додають до веб-сторінки «рухомий рядок» із тексту, розташованого між ними
11
Практичне завдання. Частина 11. Створити власну веб сторінку за наведеною темою згідно варіанту.2. У блокноті створити текстовий документ та вставити текст, що стосується вашої теми, наприклад: Комп'ютерний вірус – це... Виділяють наступні види шкідливого програмного забезпечення:....3. Оформити даний текст використовуючи теги мови гіпертекстової розмітки HTML обов'язково використавши: - колір фону сторінки (наприклад, сірий); - колір тексту на сторінці (наприклад, синій); - напівжирний текст, текст курсивом, підкреслений текст; - різні розміри тексту; - лінію певного кольору, що відділяє заголовок сторінки від тексту чи т.п.; - вирівнювання абзаців;4. Збережіть створений документ з розширенням .html (файл\зберегти як...\змінюємо розширення .txt на .html)Зразок стандартного обов'язкового коду сторінки також наведено на стор.198 (Морзе Н. В. Інформатика 9 клас)12
Теми. Комп'ютерні мережіСервіси інтернету. Комп'ютерні презентаціїВид комп'ютерних вірусів. Що таке фішинг. Антивірусні програми. Види комп'ютерної графіки. Мови програмування. Засоби комп'ютерної графіки. Векторна графіка. Растрова графіка. Мова програмування HTMLХмарні технологіїЕтапи створення сайтів. Текстові редактори. Бази даних. Апаратне забезпечення ПКМова програмування Python 13 Антивірусні програми. Види комп'ютерної графіки3 D принтери. Засоби комп'ютерної графіки. Векторна та растрова графіка3 D графіка. Мова програмування HTMLХмарні технології Google. Етапи створення сайтів. Текстові редактори. Хмарні технології Microsoft. Апаратне забезпечення ПКМова програмування Scratch. Комп'ютерні мережіСервіси інтернету. Комп'ютерні презентаціїВид комп'ютерних вірусів. Що таке фішинг
Завдання за варіантами. Необхідно створити невеличку веб-сторінку у блокноті. Тема сторінки вказана на попередньому слайді за варіантами. Вкажіть її заголовком. Скопіюйте декілька речень по даній темі з мережі інтернет та вставте у документ. Відділіть лінією заголовок від тексту. Оформіть сторінку так як вказано для вашого варіанту на слайдах нижче. Збережіть у форматі «.html» та завантажте у Гугл клас.14
Варіант 1 Заголовок 2 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.15
Варіант 2 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.16
Варіант 3 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.17
Варіант 4 Заголовок 4 рівня, напівжирний. Лінія довжиною 100 пікселів, товщиною 6 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – чорний. Вирівнювання абзаців – по центру.18
Варіант 5 Заголовок 1 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.19
Варіант 6 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.20
Варіант 7 Заголовок 2 рівня, напівжирний. Лінія довжиною 300 пікселів, товщиною 2 пікселі, чорного кольору. Стиль шрифту тексту - підкреслений. Колір тексту – червоний. Колір фону документу – білий. Вирівнювання абзаців – по центру.21
Варіант 8 Заголовок 1 рівня, підкреслений. Лінія довжиною 250 пікселів, товщиною 4 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – жовтий. Колір фону документу – сірий. Вирівнювання абзаців – по лівому краю.22
Варіант 9 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.23
Варіант 10 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.24
Варіант 11 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.25
Варіант 12 Заголовок 2 рівня, напівжирний. Лінія довжиною 225 пікселів, товщиною 8 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – сірий. Вирівнювання абзаців – по центру.26
Варіант 13 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.27
Варіант 14 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.28
Варіант 15 Заголовок 2 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.29
Варіант 16 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.30
Варіант 17 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.31
Варіант 18 Заголовок 4 рівня, напівжирний. Лінія довжиною 100 пікселів, товщиною 6 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – чорний. Вирівнювання абзаців – по центру.32
Варіант 19 Заголовок 1 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.33
Варіант 20 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.34
Варіант 21 Заголовок 2 рівня, напівжирний. Лінія довжиною 300 пікселів, товщиною 2 пікселі, чорного кольору. Стиль шрифту тексту - підкреслений. Колір тексту – червоний. Колір фону документу – білий. Вирівнювання абзаців – по центру.35
Варіант 22 Заголовок 1 рівня, підкреслений. Лінія довжиною 250 пікселів, товщиною 4 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – жовтий. Колір фону документу – сірий. Вирівнювання абзаців – по лівому краю.36
Варіант 23 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.37
Варіант 24 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.38
Варіант 25 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.39
Варіант 26 Заголовок 2 рівня, напівжирний. Лінія довжиною 225 пікселів, товщиною 8 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – сірий. Вирівнювання абзаців – по центру.40
Варіант 27 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.41
Варіант 28 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.42
Варіант 29 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.43
Варіант 30 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.44
Варіант 31 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.45
Варіант 32 Заголовок 2 рівня, напівжирний. Лінія довжиною 225 пікселів, товщиною 8 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – сірий. Вирівнювання абзаців – по центру.46
Варіант 33 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.47
Варіант 34 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.48
Варіант 35 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.49
Варіант 36 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.50
1 / 50
Зміст слайдів
Номер слайду 1

Створення веб-сторінки за обраною темою на мові розмітки гіпертексту НТМLЧастина 1. Форматування тексту

Номер слайду 2

Створення веб сторінки2 Відкрити програму БЛОКНОТВвести HTML-код:3. Зберегти файл з розширенням htm або html: Файл /Сохранить как… Index.html4. Запуск збереженого файлу:

Номер слайду 3

Стилі шрифтів3<В> … - напівжирного накреслення Щоб задати будь-яке зображення шрифту, використовуються стилі. … - курсивне накреслення … - підкреслений текст … — імітація шрифту друкарської машинки … - перекреслений текст Україна До одного текстового фрагменту можна застосовувати декілька стилів. Для цього слід пам’ятати правило вкладених тегів, згідно з яким їх потрібно закривати у зворотному до відкривання порядку.

Номер слайду 4

Атрибути тегу 4 атрибутатрибутзначеннязначеннявідкриваючий тегзакриваючийтег. BGCOLOR = #000000 – встановлення кольору фону. TEXT = “red” – задає колір тексту. BACKGROUND = “URL” – замість URL вказують адресу малюнка, який має бути тлом для сторінки. LINK = #0000 CD – визначає колір гіперпосилань у документіALINK = #7 FFF00 – задає колір гіперпосилань під час клацання. VLINK = #B22222 – задає колір переглянутих гіперпосилань….

Номер слайду 5

Формування абзаців і рядків5

абзац

- створення абзацу
- розрив рядка
абзац
- створення розділу. При створенні Web-сторінок потрібно прагнути до лаконічних текстів, які чітко розділені на абзаци. Для створення абзацу у мові HTML передбачено вико­ристання тегів. Втім, кінцевий тег в елементі абзацу не є обов'язковим. Для розриву рядка застосовується тег Цей тег є порожнім елементом, що змушує браузер перевести текст на новий рядок. Теги <ВR> зручні при оформленні поштових адрес, наборі віршів тощо. Для структуризації тексту в HTML-документах використовуються розділи, що задаються тегами. Характерною ознакою елементів DIV є наявність порожнього рядка перед ними.

Номер слайду 6

Задання заголовків6 Заголовки поділяють HTML-документ на логічно закінчені блоки. Завдяки заголовкам відвідувач Web-сторінки може отримати уявлення про її вміст. Для задания заголовків використовуються парні теги <Нi>…. Усього передбачено 6 рівнів заголовків:

Заголовок - заголовок 1-го рівня, найвищого рівня

Заголовок - заголовок 2-го рівня

Заголовок - заголовок 3-го рівня

Заголовок - заголовок 4-го рівня

Заголовок - заголовок 5-го рівня
Заголовок - заголовок 6-го рівня, найменшого розміру

Номер слайду 7

Горизонтальна лінія7

- встановлення горизонтальної лініїГоризонтальна лінія – це графічний елемент HTML-документа, який має довжину, товщину та колір. Для створення ліній призначено елемент: Зовнішній вигляд ліній можна змінити за допомогою атрибутів тегу
:noshade – суцільна лінія без тіні (
) Align = “значення” – тип вирівнювання лінії на сторінціЦей атрибут може набувати значень: left, right, center.width = “значення” – ширина лінії у пікселях або відсоткахsize = “значення” – товщина лінії в діапазоні від 1 до 175 пікселівcolor = “значення” – колір лінії (
)

Номер слайду 8

Вирівнювання абзаців8 Абзаци, що задаються тегом <Р>, розділи

і заголовки <Нi>, за умовчанням вирів­нюються по лівому краю сторінки. Змінити тип вирівнювання можна за допомогою атрибута Align : Align = "center" – вирівнювання по центру. Align ="left" – по лівому краю сторінки. Align ="right" – по правому краю сторінки. Align ="justify" – рівномірно розташувати по ширині вікна. Наприклад, вирівнювання абзацу по центру:<Р Align = "center">

Номер слайду 9

Форматування символів 9 текст - зміна шрифту. Параметри шрифту, який використовується для відображення тексту на Web-сторінках, найпростіше визначити за допомогою елеме­нта. Для цього елемента передбачені такі атрибути: size = “значення” – розмір шрифтуcolor = “значення” – колір шрифтуface = “значення” – гарнітура шрифту або список шрифтів. Розмір шрифту виражається у відносних одиницях, що записуються цілими числами від 1 до 7. За замовчуванням використовується основний шрифт, розмір якого дорівнює 3. Колір задається англійською назвою або кодом. Код – послідов­ність 3 пар символів. Кожна пара – це шістнадцяткове значення насиченості (яскравості) заданого кольору одним з 3 основних кольорів (червоного, зеленого, синього – модель RGB) в діапазоні від нуля (00) до 255 (FF). В атрибуті face як значення допустимо вказувати декілька гарнітур шрифтів, відокремлюючи їх комою. Для відображення тексту браузер застосує одну із зазначених гарнітур, ім’я якої першою буде збігатися з наявною в наборі гарнітур шрифту браузера.

Номер слайду 10

Стилі шрифтів10 … – верхній індекс (S=Pi*R2) … – нижній індекс (H2O) … – зменшення розміру шрифту … – збільшення розміру шрифту … – «рухомий рядок»Є й інші теги, які можна застосовувати для зміни параметрів тексту. Розмір символів збільшується (зменшується) на одиницю відносно поточного рівня. Для відображення індексів в HTML передбачено наступні теги. Цікавого оформлення веб-сторінці надає пара тегів. Вони додають до веб-сторінки «рухомий рядок» із тексту, розташованого між ними

Номер слайду 11

11

Номер слайду 12

Практичне завдання. Частина 11. Створити власну веб сторінку за наведеною темою згідно варіанту.2. У блокноті створити текстовий документ та вставити текст, що стосується вашої теми, наприклад: Комп'ютерний вірус – це... Виділяють наступні види шкідливого програмного забезпечення:....3. Оформити даний текст використовуючи теги мови гіпертекстової розмітки HTML обов'язково використавши: - колір фону сторінки (наприклад, сірий); - колір тексту на сторінці (наприклад, синій); - напівжирний текст, текст курсивом, підкреслений текст; - різні розміри тексту; - лінію певного кольору, що відділяє заголовок сторінки від тексту чи т.п.; - вирівнювання абзаців;4. Збережіть створений документ з розширенням .html (файл\зберегти як...\змінюємо розширення .txt на .html)Зразок стандартного обов'язкового коду сторінки також наведено на стор.198 (Морзе Н. В. Інформатика 9 клас)12

Номер слайду 13

Теми. Комп'ютерні мережіСервіси інтернету. Комп'ютерні презентаціїВид комп'ютерних вірусів. Що таке фішинг. Антивірусні програми. Види комп'ютерної графіки. Мови програмування. Засоби комп'ютерної графіки. Векторна графіка. Растрова графіка. Мова програмування HTMLХмарні технологіїЕтапи створення сайтів. Текстові редактори. Бази даних. Апаратне забезпечення ПКМова програмування Python 13 Антивірусні програми. Види комп'ютерної графіки3 D принтери. Засоби комп'ютерної графіки. Векторна та растрова графіка3 D графіка. Мова програмування HTMLХмарні технології Google. Етапи створення сайтів. Текстові редактори. Хмарні технології Microsoft. Апаратне забезпечення ПКМова програмування Scratch. Комп'ютерні мережіСервіси інтернету. Комп'ютерні презентаціїВид комп'ютерних вірусів. Що таке фішинг

Номер слайду 14

Завдання за варіантами. Необхідно створити невеличку веб-сторінку у блокноті. Тема сторінки вказана на попередньому слайді за варіантами. Вкажіть її заголовком. Скопіюйте декілька речень по даній темі з мережі інтернет та вставте у документ. Відділіть лінією заголовок від тексту. Оформіть сторінку так як вказано для вашого варіанту на слайдах нижче. Збережіть у форматі «.html» та завантажте у Гугл клас.14

Номер слайду 15

Варіант 1 Заголовок 2 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.15

Номер слайду 16

Варіант 2 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.16

Номер слайду 17

Варіант 3 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.17

Номер слайду 18

Варіант 4 Заголовок 4 рівня, напівжирний. Лінія довжиною 100 пікселів, товщиною 6 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – чорний. Вирівнювання абзаців – по центру.18

Номер слайду 19

Варіант 5 Заголовок 1 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.19

Номер слайду 20

Варіант 6 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.20

Номер слайду 21

Варіант 7 Заголовок 2 рівня, напівжирний. Лінія довжиною 300 пікселів, товщиною 2 пікселі, чорного кольору. Стиль шрифту тексту - підкреслений. Колір тексту – червоний. Колір фону документу – білий. Вирівнювання абзаців – по центру.21

Номер слайду 22

Варіант 8 Заголовок 1 рівня, підкреслений. Лінія довжиною 250 пікселів, товщиною 4 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – жовтий. Колір фону документу – сірий. Вирівнювання абзаців – по лівому краю.22

Номер слайду 23

Варіант 9 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.23

Номер слайду 24

Варіант 10 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.24

Номер слайду 25

Варіант 11 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.25

Номер слайду 26

Варіант 12 Заголовок 2 рівня, напівжирний. Лінія довжиною 225 пікселів, товщиною 8 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – сірий. Вирівнювання абзаців – по центру.26

Номер слайду 27

Варіант 13 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.27

Номер слайду 28

Варіант 14 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.28

Номер слайду 29

Варіант 15 Заголовок 2 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.29

Номер слайду 30

Варіант 16 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.30

Номер слайду 31

Варіант 17 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.31

Номер слайду 32

Варіант 18 Заголовок 4 рівня, напівжирний. Лінія довжиною 100 пікселів, товщиною 6 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – чорний. Вирівнювання абзаців – по центру.32

Номер слайду 33

Варіант 19 Заголовок 1 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.33

Номер слайду 34

Варіант 20 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.34

Номер слайду 35

Варіант 21 Заголовок 2 рівня, напівжирний. Лінія довжиною 300 пікселів, товщиною 2 пікселі, чорного кольору. Стиль шрифту тексту - підкреслений. Колір тексту – червоний. Колір фону документу – білий. Вирівнювання абзаців – по центру.35

Номер слайду 36

Варіант 22 Заголовок 1 рівня, підкреслений. Лінія довжиною 250 пікселів, товщиною 4 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – жовтий. Колір фону документу – сірий. Вирівнювання абзаців – по лівому краю.36

Номер слайду 37

Варіант 23 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.37

Номер слайду 38

Варіант 24 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.38

Номер слайду 39

Варіант 25 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.39

Номер слайду 40

Варіант 26 Заголовок 2 рівня, напівжирний. Лінія довжиною 225 пікселів, товщиною 8 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – сірий. Вирівнювання абзаців – по центру.40

Номер слайду 41

Варіант 27 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.41

Номер слайду 42

Варіант 28 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.42

Номер слайду 43

Варіант 29 Заголовок 1 рівня, напівжирний. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.43

Номер слайду 44

Варіант 30 Заголовок 1 рівня, підкреслений. Лінія довжиною 200 пікселів, товщиною 5 пікселі, червоного кольору. Стиль шрифту тексту - напівжирним. Колір тексту – зелений. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.44

Номер слайду 45

Варіант 31 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 3 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по центру.45

Номер слайду 46

Варіант 32 Заголовок 2 рівня, напівжирний. Лінія довжиною 225 пікселів, товщиною 8 пікселі, синього кольору. Стиль шрифту тексту - курсивом. Колір тексту – білий. Колір фону документу – сірий. Вирівнювання абзаців – по центру.46

Номер слайду 47

Варіант 33 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.47

Номер слайду 48

Варіант 34 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.48

Номер слайду 49

Варіант 35 Заголовок 3 рівня, курсивом. Лінія довжиною 150 пікселів, товщиною 4 пікселі, сірого кольору. Стиль шрифту тексту - напівжирний. Колір тексту – синій. Колір фону документу – жовтий. Вирівнювання абзаців – по лівому краю.49

Номер слайду 50

Варіант 36 Заголовок 1 рівня, курсивом. Лінія довжиною 125 пікселів, товщиною 5 пікселі, синього кольору. Стиль шрифту тексту - напівжирним. Колір тексту – синій. Колір фону документу – сірий. Вирівнювання абзаців – по правому краю.50

pptx
Додав(-ла)
Докторук Євген
Пов’язані теми
Інформатика, Матеріали до уроків
Додано
29 березня 2022
Переглядів
1953
Оцінка розробки
Відгуки відсутні
Безкоштовний сертифікат
про публікацію авторської розробки
Щоб отримати, додайте розробку

Додати розробку
Рекомендовані матеріали
docx
1168 0
Урок "Розв’язання квадратних рівнянь та побудова графіків з використанням табличного процесора Excel"
docx
1514 0
Створення алгоритмів і програм з використанням змінних і різних алгоритмічних структур: повторень.
pptx
4363 0
Практична робота № 11 "Проєкти з розгалуженням"
pptx
677 0
Презентація "Складання програм із циклами в Python"
Схожі матеріали
docx
4436 0
Конспект уроку з інформатики для 10-го класу на тему: "Робота з електронною поштою з використанням веб-інтерфейсу."
docx
23017 4
Конспект уроку з інформатики для 5-го класу на тему: "Критичне оцінювання інформації, отриманої з Інтернету".
doc
4827 0
“ Поняття про комп’ютерні віруси. Класифікація комп’ютерних вірусів."
ppt
3411 0
Презентація до майстер-класу «Застосування комп’ютерних технологій як засобу розвитку логічного мислення молодших школярів»
doc
2368 0
Підсумковий урок з теми «Текстовий процесор».
Завантажити
Зберегти на потім