Урок:

Практична робота N2 «Мова HTML. Теги форматування тексту»

Вміст уроку:
1
2
Опис, який учні побачать перед початком уроку

Доброго дня читаєм умову уроку виконуєм у програмі блокнот та зберігаєм із розширенням HTML.

Урок не містить жодного завдання. Додайте завдання.

Щоб додати завдання, оберіть категорію завдання на панелі запитань.

1

10 з 21 бала

Практична робота №2

«Мова HTML. Теги форматування тексту»

Текст у HTML форматують за допомогою відповідних тегів, які наведені в таблиці.

Теги

Ефект

Приклад

<B> та </B>

Напівжирне

накреслення

bold

<I> та </I>

Курсивне накреслення

italic

<U> та </U>

Підкреслене

underlined

<S> та </S>

Перекреслене

striken

<SUP> та </SUP>

Верхній індекс

superscript

<SUB> та </SUB>

Нижній індекс

subscript

<BASEFONT> - одинарний тег, задає гарнітуру(шрифт), розмір і колір шрифту, діє на весь текст і має такі атрибути:

  • FACE=”значення” – гарнітура (шрифт), наприклад FACE=”Monotype Corsiva”, тоді текст html-документу буде мати гарнітурушрифта Monotype Corsiva.

  • SIZE=значення – розмір шрифту (ціле число від 1 до 7). Шрифти різних розмірів мають такий вигляд:

1       2 3  4 5 6 7 (7-найбільший розмір шрифту)

  • COLOR=значення – колір шрифту. Як значення кольоруможна використовувати назви кольорів

    англійською мовою, такі як red, green,blue тощо, або шістнадцяткові значення, 

    що починаються з символу # і послідовно задають червоний, зеленийта синій кольори,які мають бути змішані для отримання потрібного. Наприклад, #FF0000, #008000, #0000FFтощо.

<FONT АТРИБУТИ>Текст</FONT> - подвійний тег, задає гарнітуру(шрифт), розмір і колір шрифту для фрагменту тексту і має такі самі атрибути як тег <BASEFONT>

Єй інші теги, які можна застосувати для зміни параметрів тексту.

  • <BIG>Текст</BIG> - збільшення розмірушрифту. Розмір символівтексту збільшується на одиницю відносно поточного рівня.

  • <SMALL>Текст</SMALL>   -   зменшення   розміру  шрифту.   Розмір символів зменшується на одиницювідносно поточного рівня.

  • <EM>Текст</EM> - виділення важливихфрагментів тексту. Текствідображатиметься курсивом.

  • <DEL>Текст</DEL> - створення перекресленого тексту. Текст буде перекреслено горизонтальною лінією.

<MARQUEE>Текст</MARQUEE> - рухомий рядок.

2

11 з 21 бала

Вправа 1

Помістимо на веб-сторінку наведений нижче текст, відформатувавши його за допомогоювідповідних тегів.

Троянда столиста

Граціозні форми, ніжне забарвлення, витончений аромат троянди з незапам’ятних часів чарували людей. Тому й створено безліч легенд про цю чарівну, ніжну й чудову квітку.

За стародавньою легендою, прекрасна богиня Лакшмі народилася з пуп’янка троянди.

У древньому індійському міфі розповідається, що прегарний юнак Адоніс, який уособлював прихід весни, повстав із куща троянди.

У Персії так шанували царицюквітів, що навітькраїна одержала назву

Гюлістан – країна троянд.

  1. Введіть HTML-код веб-сторінки, на якій відображатиметься наведений вище відформатований текст.

У цьому прикладі для деяких фрагментів тексту необхідно застосувати по два теги форматування, наприклад, <I><U>Україні</U></I>. Слід пам’ятати про правиловкладених тегів, згідно з яким їх потрібнозакривати у зворотному до відкривання порядку. Тобто, якщо спершу відкрилитег курсиву, а потім – тег підкреслення, то спочатку слід закриватитег підкреслення, а потім курсиву.

  1. Збережіть HTML-документ   у файлі з розширенням .html. Відправити на електронну пошту.

Рефлексія від 14 учнів

Сподобався:

0

Так: 13

Ні: 1

Зрозумілий:

0

Так: 12

Ні: 2

Потрібні роз'яснення:

0

Ні: 13

Так: 1

Рекомендуємо

HTML Створення форм. Практична робота

HTML Створення форм. Практична робота

380

Аватар профіля Брусенцова Катерина Юріївна
Інформатика
11 клас

50 грн

Практична робота "Форматування та формули в Excel"

Практична робота "Форматування та формули в Excel"

353

Аватар профіля Киреєва Оксана Анатоліївна
Інформатика
7 клас

50 грн

Практична робота № 1: "Форматування шрифту в текстовому процесорі"

Практична робота № 1: "Форматування шрифту в текстовому процесорі"

339

Аватар профіля Киреєва Оксана Анатоліївна
Інформатика
10—11 клас

50 грн

Мова розмітки гіпертексту (HTML)

Мова розмітки гіпертексту (HTML)

236

Аватар профіля Губчик Вероніка Григорівна
Інформатика
11 клас

50 грн

Додавання тексту до графічних зображень та його форматування

Додавання тексту до графічних зображень та його форматування

549

Аватар профіля Лизько Валентина Степанівна
Інформатика
7 клас

35 грн

Практична робота: Анімація руху тексту в GIMP

Практична робота: Анімація руху тексту в GIMP

340

Аватар профіля Губчик Вероніка Григорівна
Інформатика
10—11 клас

50 грн

Схожі уроки

М. 2.Обробка нижнього зрізу жіночих штанів

М. 2.Обробка нижнього зрізу жіночих штанів

733

Аватар профіля Кобилянська Катерина Анатоліївна
Професійна освіта
дорослі

М.2. Обробка верхнього зрізу жіночих штанів поясом

М.2. Обробка верхнього зрізу жіночих штанів поясом

1222

Аватар профіля Кобилянська Катерина Анатоліївна
Професійна освіта
дорослі

М.2. Обробка застібки на тасьму блискавку

М.2. Обробка застібки на тасьму блискавку

600

Аватар профіля Кобилянська Катерина Анатоліївна
Професійна освіта
дорослі

М.2. Обробка кишень в жіночих штанах

М.2.  Обробка кишень в жіночих штанах

640

Аватар профіля Кобилянська Катерина Анатоліївна
Професійна освіта
дорослі

М. 2. Обробка виточок та зрізів штанів

М. 2. Обробка виточок та зрізів штанів

708

Аватар профіля Кобилянська Катерина Анатоліївна
Професійна освіта
дорослі

Обробка коміра суцільнокроєного з деталями виробу та з'єднання його з горловиною

Обробка коміра   суцільнокроєного з деталями виробу та з'єднання його з горловиною

955

Аватар профіля Колесник Людмила Володимирівна
Професійна освіта
дорослі
✖
↑