8_клас_Поняття про мову гіпертекстової розмітки
Presentation
•
Computers
•
8th Grade
•
Practice Problem
•
Medium
Наталія Володимирівна Вінокурова
Used 4+ times
FREE Resource
16 Slides • 8 Questions
1
Поняття про мову гіпертекстової розмітки
By Наталія Володимирівна Вінокурова
2
HTML (мова гіпертекстової розмітки) —
це код, який використовується для структурування і відображення веб-сторінки та її контенту.
3
Multiple Choice
Що таке HTML?
Мова гіпертекстової розмітки документів для інтернету
Додаткова інформація, що записується біля відкривального тегу
Команда, що записується в кутових дужках < > для виконання браузером
Мова програмування, яка використовується для створення сайтів
4
Створювати вебсторінки мовою HTML можна двома способами:
за допомогою спеціального редактора HTML, у якому є заготовки та фрагменти готового коду
писати безпосередньо на HTML
5
Мова HTML існує в декількох варіантах і продовжує розвиватися, але її конструкції, найімовірніше, будуть використовуватися і надалі.
Вивчаючи й пізнаючи HTML детальніше, створюючи документ на початку вивчення HTML і розширюючи його, наскільки це можливо, ми маємо змогу створювати документи, які можуть бути переглянуті багатьма браузерами, — як зараз, так і в майбутньому.
6
Типовий простий вебдокумент складається з:
текстових блоків (абзаців, списків, таблиць)
малюнків невеликих розмірів
горизонтальних розмежувальних ліній
гіперпосилань
7
Основою мови HTML є дескриптори — команди, що вказують на правила, за якими форматуються документи. Команди мови HTML називають тегами.
8
Отже, крім текстових даних, вебсторінка містить невидимий для користувача HTML-код, тобто набір тегів. Під час відкриття вебсторінки браузер використовує цей набір для відображення її елементів у заданому порядку.
9
Назва кожного тегу — це одна або декілька літер, взятих у кутові дужки (< та >), яким відповідають певні англійські слова, що пояснюють їх призначення.
Наприклад, назва тегу <BODY> виникла від англійського слова body — тіло, головна частина, а сам тег використовується для створення вмісту вебсторінки.
10
Multiple Choice
Що таке тег?
Мова гіпертекстової розмітки документів для інтернету
Додаткова інформація, що записується біля відкривального тегу
Команда, що записується в кутових дужках < > для виконання браузером
Мова програмування, яка використовується для створення сайтів
11
Тег записують так:
12
Пару тегів (відкриваючий і закриваючий) називають контейнером.
Закриваючий тег відрізняється від відкриваючого лише тим, що в коді перед його іменем ставиться символ:
/
Більшість тегів є парними, однак існують й одинарні.
13
Один тег може мати кілька параметрів — атрибутів. Наприклад,
<Тег параметр_1= значення_1 параметр_2 = значення_2 > текст, що відображається на сторінці </Тег>
Закриваючий тег не містить жодних параметрів. На відміну від нього, у відкриваючому тегу вказуються всі необхідні параметри.
14
Multiple Choice
Що таке атрибут?
Мова гіпертекстової розмітки документів для інтернету
Додаткова інформація, що записується біля відкривального тегу
Команда, що записується в кутових дужках < > для виконання браузером
Мова програмування, яка використовується для створення сайтів
15
Правила запису параметрів: після назви тегу після пропуску зазначається ім’я параметра наприклад,
Далі вказується знак «=» й у лапках записується значення параметра,
За необхідності далі вказують інші параметри через пропуск. Після останнього параметра записується символ:
>
16
Теги можуть бути вкладеними, тобто один контейнер може перебувати всередині іншого, у такому разі загальний запис виглядатиме так:
Для підготовки найпростішого HTML-файлу можна використати текстовий редактор Блокнот, після написання коду в якому слід задати файлу ім’я та вказати розширення — html.
17
Multiple Select
Що є атрибутами у наведеному HTML-коді?
</html>
bgcolor = "green"
<body>
text = "white"
18
Multiple Select
Які теги є парними?
<br>
<u>
<н>
<b>
19
HTML-документа можна вставляти маркований і нумерований списки. Для цього використовуються відповідні теги:
Маркований список
Нумерований список
20
Fill in the Blanks
Відновіть послідовність розташування тегів і написів HTML-документа для зображення нумерованого списку, наведеного на рисунку.
1. </li>
2. інформатика
3. <li>
4. <ol>
5. </ol>
Відповідь запишіть правильною послідовністю цифр. Наприклад: 12345
Type answer...
21
Програма мовою HTML має таку структуру:
22
Fill in the Blanks
Відновіть правильну послідовність запису тегів HTML-документа.
1. <body>
2. </head>
3. <head>
4. <html>
5. </body>
6. </html>
Відповідь запишіть правильною послідовністю цифр. Наприклад: 12345
Type answer...
23
На відображення документа в браузері не впливають символи кінця рядка, які отримують натискуванням клавіші Enter або Shift+ Enter, а також пропуски. Для перенесення тексту на новий рядок використовують одинарний тег <BR>.
Для створення абзаців використовують парний тег:
При використанні тегу <Р> спочатку вставляється порожній рядок, далі текст виводиться з початку нового рядка. Якщо вжито тег , то порожній рядок не вставляється.
24
Fill in the Blanks
Запишіть англійськими малими літерами без кутових дужок назву тегу розриву рядка
Type answer...
Поняття про мову гіпертекстової розмітки
By Наталія Володимирівна Вінокурова
Show answer
Auto Play
Slide 1 / 24
SLIDE
Similar Resources on Wayground
19 questions
Active and Passive Voice
Presentation
•
7th - 8th Grade
16 questions
Balancing Chemical Equations
Presentation
•
8th Grade
20 questions
MS DOS
Presentation
•
8th Grade
18 questions
Transformations Lesson
Presentation
•
8th Grade
19 questions
8 sinf veb sayt
Presentation
•
8th Grade
20 questions
Basic Python Review Lesson
Presentation
•
9th Grade
18 questions
Teknologi Informasi dan Komunikasi
Presentation
•
8th Grade
18 questions
Линейный алгоритм
Presentation
•
8th Grade
Popular Resources on Wayground
6 questions
PRIDE Always and Everywhere
Presentation
•
12th Grade
20 questions
Lab Safety Quiz
Quiz
•
6th Grade
26 questions
KOR Review Kahoot Questions
Quiz
•
8th Grade
21 questions
Continents and Oceans
Quiz
•
6th Grade
12 questions
Unit Zero lesson 2 cafeteria
Presentation
•
9th - 12th Grade
20 questions
Parts of Speech
Quiz
•
5th Grade
10 questions
Riddles Riddles fun Riddles
Quiz
•
6th - 12th Grade
16 questions
Subject & Predicate
Quiz
•
5th Grade
