Презентація на тему: Графічні, гіпертекстові та інші елементи на веб - сторінках

Про матеріал
Урок створений з метою формувати вміння практичного застосування гіпертекстових, графічних, елементів на веб-сторінках. Формувати вміння розв’язувати типові завдання, формувати творчі вміння. Формувати групи компетентностей: соціально-трудову, інформаційну, загальнокультурну, соціально-трудову, уміння вчитися.
Зміст слайдів
Номер слайду 1

Гіпертекстові, графічні та інші елементи на веб - сторінках

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

Поняття тегу:Інформація про форматування документу міститься в фрагментах, розташованих між знаками <> - такий фрагмент називають тегом. Приклади тегів:,,</A>,<img>,<teble>,</center>/ - слеш ставиться перед закриваючим тегом</p> </div> </div> </div> <div class="slide-transcript"> <div class="row"> <div class="col-md-5"> <a href="/uploads/files/94543/82353/87991_images/3.jpg" data-lightbox="slides" data-title="Слайд №3"><img src="/uploads/files/94543/82353/87991_images/thumb_3.jpg" width="100%" /></a> </div> <div class="col-md-7"> <div class="num">Номер слайду 3</div> <p><html></html> - починає та закінчує документ<head></head> - починає та закінчує заголовок документу<title> - задає назву документа - починає та закінчує тіло документу

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

Структура гіпертекстуНазва сторінки - Назва сторінки відображається у заголовку вікнаЗміст сторінки - Те, що буде відображатися безпосередньо на сторінці

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

1. Початковий код HTML в блокноті має вигляд: Це початковий та закриваючий тег. Таблиця кодування UTF- 8 Назва сторінки

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

2. Спосіб збереження

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

3. Копіювання тексту(вправа 4.2)

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

4. Вставлення тексту. Текст вставляється між тегами body

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

5. Збереження та перегляд сторінки. Після кожних нових записів в блокноті застосовується збереження Ctrl C

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

6. Встановлення блакитного кольору фону сторінки. BGCOLOR - колір фону

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

Створення заголовку. Розташування заголовку по центру. F 5 – оновлення сторінки. ALIGN

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

Оформлення тексту Історія мови як заголовок другого рівня

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

Щоб вставити зображення, його спочатку потрібно скопіювати в папку де знаходиться документ мови HTML з розширенням. Прописати тег, скопіювати назву файла та вставити, прописати розширення! Закриваючий тег не потрібен

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

Для зменшення зображення прописуємо ширину 100 пікселів. Та обтікання текстом текстом по лівому краю

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

Гіперпосиланнятекст/зображення - гіперпосилання на веб-сторінку, або файл іншого формату. Мітки на веб-сторінціВикористання мітки передбачає її створення та посилання на неї.текст, або інший об’єкт веб-сторінки - створення мітки. Цей тег ставиться перед об’єктом, до якого потрібно організувати перехід.текст/зображення - посилання на мітку, створену на даній веб-сторінці.текст/зображення - посилання на мітку на іншій веб-сторінці. Значенням параметра є url-адреса веб-сторінки після якої одразу ставиться знак # і ім’я мітки.

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

Оформлення абзацу тексту – теги абзацу <р> Вирівнювання абзацу за шириною та встановлення імені вченого напівжирним шрифтом – теги Оформлення гіперпосилання на веб – сторінку – теги

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

Оформлення курсивом - теги<1>Встановлення горизонтальної лініїОформлення тегу синім кольором. Всановлення розміру 5

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

Кінцевий вигляд сторінки в блокноті та браузері

Середня оцінка розробки
Структурованість
5.0
Оригінальність викладу
5.0
Відповідність темі
5.0
Загальна:
5.0
Всього відгуків: 1
Оцінки та відгуки
  1. K Oleg
    Загальна:
    5.0
    Структурованість
    5.0
    Оригінальність викладу
    5.0
    Відповідність темі
    5.0
pptx
Додано
17 січня 2019
Переглядів
11230
Оцінка розробки
5.0 (1 відгук)
Безкоштовний сертифікат
про публікацію авторської розробки
Щоб отримати, додайте розробку

Додати розробку