Презентація - Основи HTML
Основи HTML. Розробка Web-сайту
Створення Web-сайтів реалізується за допомогою мови розмітки гіпертекстових документів HTML. Технологія HTML полягає в тому, що в звичайний текстовий документ вставляються символи керування (теги) і в результаті ми отримуємо Web-сторінку.
Вигляд Web-сторінки задається тегами, які полягають в кутові дужки.
HTML-код сторінки розміщується всередині контейнера Заголовок Web-сторінки полягає в контейнері Назва Web-сторінки міститься в контейнері Комп'ютер
Розмір шрифту для наявних у тексті заголовків задається тегами від (найбільший) до (найменший) Все про комп'ютер Задати тип вирівнювання заголовка для тега заголовка дозволяє атрибут ALIGN Вирівнювання по правій межі вікна реалізується за допомогою ALIGN = "right", а по центру ="center"Bce про комп'ютер
За допомогою тега FONT та його атрибутів можна встановити параметри форматування шрифту будь-якого фрагмента тексту. Атрибут FACE дозволяє задати гарнітуру шрифту (наприклад, FACE = "Arial"), атрибут SIZE - розмір шрифту (наприклад, SIZE = 4), атрибут COLOR - колір шрифту (наприклад, COLOR = "blue") Bce про комп'ютер Заголовок доцільно відокремити від іншого змісту сторінки горизонтальною лінією за допомогою одиночного тега РОБОТА З ЗАГОЛОВКОМ ЗАКІНЧЕНО!
Поділ тексту на абзаци здійснюється за допомогою контейнера Помістимо на титульну сторінку текст, розбитий на абзаци з різним вирівнюванням:
Комп'ютерBce про комп'ютерHa цьому сайті ви зможете отримати різнуінформацію про комп'ютер, його програмне забезпечення та ціни на комп'ютерні комплектуючі. Термінологічний словник познайомить вас із комп'ютерними термінами, а також ви зможете заповнити анкету.
Для вставки зображення використовується тег з атрибутом SRC Пояснюючий текст виводиться за допомогою атрибута ALT, значенням якого є текст, який пояснює, що мав би побачити користувач на малюнку:
Розмістити малюнок щодо тексту різними способами дозволяє атрибут ALIGN тега , який може набувати п'ять різних значень: ТОР (верх), MIDDLE (середина), BOTTOM (низ), LEFT (ліворуч) RIGHT (праворуч).
Гіперпосилання Перша титульна сторінка повинна надавати відвідувачу Web-сайту можливість розпочати подорож сайтом. Для цього на титульну сторінку мають бути розміщені гіперпосилання на інші сторінки сайту.
Заголовок сторінкиСтворити порожні сторінки «Програми», «Словник», «Комплектуючі» та «Анкета» та зберегти їх у файлах з іменами software.htm, glossary.htm, hardware.htm та anketa.htm у каталозі сайту.
Панель навігації буде абзац, вирівняний по центру, в якому покажчики гіперпосилань розділені пробілами ( ):[Програми]   [Словник]  [Комплектуючі]   [Анкета]
[Програми]  [Словник]  [Комплектуючі]  [Анкетa]
Список розміщується всередині контейнера, а кожен елемент списку визначається тегом. За допомогою атрибуту TYPE тега можна задати тип нумерації: арабські цифри (за замовчуванням), "I" (римські цифри), "а" (малі літери) і т.д. Програмні продукти
Сторінку «Словник» ми представимо у вигляді словника комп'ютерних термінів. Для цього використовуємо контейнер спискувизначень. Усередині нього текст оформляється у вигляді терміна, який виділяється непарним тегом, і визначення, яке слідує за тегом Процесор Центральний пристрій комп'ютера, що робить обробку інформації в двійковому коді. Оперативна пам'ять Пристрій, в якому зберігаються програми та дані.
Форма полягає в контейнері Текстові поля: створюються за допомогою тега зі значенням атрибуту TYPE="text". Атрибут NAME є обов'язковим та служить для ідентифікації отриманої інформації. Значенням атрибута SIZE є число, що задає довжину поля введення символів. Щоб анкета «читалась», необхідно розділити рядки з допомогою тега перекладу рядка .
Перемикачі Група перемикачів («радіокнопок») створюється за допомогою тега зі значенням атрибуту TYPE="radio". Усі елементи групи повинні мати однакові значення атрибута NAME. Наприклад, NAME="group". Ще одним обов'язковим атрибутом є VALUE, якому надамо значення "schoolboy", "student" та "teacher". Значення атрибуту VALUE має бути унікальним для кожної «радіокнопки», оскільки при її виборі вони передаються серверу.
Вкажіть, до якої групи користувачів ви відносите себе:
Якщо із запропонованого переліку він потрібно вибрати одночасно кілька варіантів, то їх позначають прапорцями. Прапорці створюються в тезі значенням атрибуту TYPE="checkbox". Прапорці, об'єднані в групу, можуть мати однакові значення атрибуту NAME. Наприклад, NAME="group". Ще одним обов'язковим атрибутом є VALUE, якому надамо, наприклад, значення "www", "e-mail" і "ftp".
Які з сервісів Інтернету ви використовуєте найчастіше:
З'ясуємо, якому з браузерів віддає перевагу відвідувач сайту. Перелік браузерів представимо у вигляді списку, що розкривається, з якого можна вибратилише один варіант. Для реалізації такого списку використовується контейнер, у якому кожен елемент списку визначається міткою. Вибір за замовчуванням елемент задається за допомогою атрибуту SELECTED.
Якому з браузерів ви віддаєте перевагу? Internet ExplorerInternet ExplorerNetscape Navigator Opera Neo Planet
Створюється така область за допомогою тега з обов'язковими атрибутами: NAME, що задає ім'я області, ROWS, що визначає число рядків, і COLS - число стовпців області. Яку інформацію ви хотіли б бачити на нашому сайті?
Відправлення введеної у форму інформації або очищення полів від введеної інформації здійснюється за допомогою кнопок. Кнопки створюються за допомогою тега. Для створення кнопки, яка надсилає інформацію, атрибуту TYPE необхідно присвоїти значення "submit", а атрибуту VALUE, який задає напис на кнопці, - значення "Відправити". атрибуту VALUE - значення "Очистити".
ДОМАШНЕ ЗАВДАННЯ вивчити умовні позначення та значення тегів (контейнерів)