Г. В. Стадник методичні вказівки icon

Г. В. Стадник методичні вказівки




Скачати 108.79 Kb.
НазваГ. В. Стадник методичні вказівки
Дата28.06.2012
Розмір108.79 Kb.
ТипДокументи

МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ

ХАРКІВСЬКА НАЦІОНАЛЬНА АКАДЕМІЯ МІСЬКОГО ГОСПОДАРСТВА


До друку

дозволяю

Перший проректор


_____________ Г. В.Стадник


МЕТОДИЧНІ ВКАЗІВКИ

до виконання лабораторної роботи

«ВИКОРИСТАННЯ HTML ПРИ РОЗРОБЦІ WEB-СТОРІНКИ.
СТВОРЕННЯ ПРОСТОГО ДОКУМЕНТА І ЗАСОБИ ФОРМАТУВАННЯ»


з дисципліни «Комп’ютерні мережі та комунікації»


(для студентів 2 курсу спеціальності 6.050.200 «Менеджмент організацій»)


ХАРКІВ – ХНАМГ – 2007

Методичні вказівки до виконання лабораторної роботи «Використання HTML при розробці WEB-сторінки. Створення простого документа і засоби форматування» з дисципліни «Комп’ютерні мережі та комунікації» (для студентів 2 курсу спеціальності 6.050. 201 «Менеджмент організацій»). Укл.: Карпенко М. Ю., Уфимцева В. Б., Гомза Н.І. — Харків: ХНАМГ, 2007.—18 с.


Укладачі: М.Ю. Карпенко,

В.Б. Уфимцева,

Н.І. Гомза


Рецензент: канд. екон. наук, доцент В.О. Костюк


Рекомендовано кафедрою «Прикладної математики та інформаційних технологій», протокол № 3 від «27» жовтня 2006 р.
^

Лабораторна робота 1. Побудова найпростішої HTML-сторінки

Мета роботи


Ознайомлення з основами мови HTML. Отримання навичок щодо використання HTML для створення простих документів. Ознайомлення з основами форматування у HTML, а саме — з тегами і атрибутами завдання кольорів.
^

Порядок виконання роботи


  1. Створити папку Лабораторная работа 1 у персональній робочій папці

  2. Запустити програму Web-coder:

  3. У шаблоні HTML документу у вікні програми Web-coder знайти розділ body.

  4. Записати між тегами та такий текстi:




  1. П
    ереглянути результати роботи документа в Internet Explorer (натиснувши кнопку F9 або пункт меню Файл-Просмотреть):






  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 1».

  2. Внести до тіла документа теги перенесення рядків
    ii:





  1. Переглянути результати в Internet Explorer (для відновлення зображення використайте клавішу F5).



  2. Записати документ HTML до папки «ЛР-1» з іменем «Задание 2».

  3. Створити заголовок сторінки з використанням тегу h3iii.





  4. Переглянути результати в Internet Explorer:






  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 3».

  2. Вирівняти заголовок документа відносно центру сторінки з використанням тегу centeriv:




  3. Переглянути результати в Internet Explorer:





  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 4».

  2. Підкреслити заголовок документа з використанням тега hrv:






  1. Переглянути результати в Internet Explorer:





  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 5».

  2. Виділити останній рядок документа за допомогою тега bvi:





  1. Переглянути результати в Internet Explorer:





  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 6».

  2. Виділити частину останнього рядка документа за допомогою тега ivii:






  1. Переглянути результати в Internet Explorer:




  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 7».

  2. Задати напис для титульної строки Internet Explorer за допомогою тега title:






  1. Переглянути результати в Internet Explorer:





  1. Записати документ HTML до папки «ЛР-1» з іменем «Задание 8».
^

Критерії оцінювання


Оцінка «5» - виконано 27 пунктів завдання.

Оцінка «4» - виконано 21 пунктів завдання.

Оцінка «3» - виконано12 пунктів завдання.
^

Лабораторна робота 2. Кольорове оформлення Web-сторінки

Мета роботи


Ознайомлення з основами форматування у HTML, а саме — з тегами і атрибутами завдання кольорів.

Порядок виконання роботи

  1. Створити папку «ЛР-2» в персональній робочій папці.

  2. Запустити програму Web-coder.

  3. У програмі Web-coder створити новий документ HTML і ввести до тіла документа такий текстviii :









  1. Переглянути результати в Internet Explorer:

  2. Записати документ HTML до папки «ЛР-2» з іменем «Задание 1».

  3. Змінити код HTML, щоб змінити колір фону та символів у документі ix, переглянути результати в Internet Explorer:







    Записати документ HTML до папки «ЛР-2» з іменем «Задание 2».

  4. При створенні HTML документів часто використовують технологію «копіювання» стилю вже існуючого документа. Розглянемо технологію визначення кольору. Для цього необхідно скопіювати до буфера обміну варіанти кольорової заливки фонуx:







  1. Для визначення кольору|цвіту| рисунку можна скористатися засобами графічного редактора Paint. Для цього потрібно:

    • Відкрити у Paint новий файл, вставити з буфера обміну (Clipboard) вихідне зображення, за яким треба визначити колір свого варіанта фрагмента.

    • Для вибору кольору фрагмента зображення зручно скористатися панеллю інструментів, на якій розташована спеціальна кнопка - піпетка-«Выбор цветов»:




    • Щоб виділити колір|цвіт| фрагмента зображення, клацніть|луснути| мишею на інструменті «Вибор цветов|цвіту|», вкажіть піпеткою на місце рисунка, колір|цвіт| якого потрібно визначити.

    • Після того, як вказаний необхідний колір, залишається визначити його палітру. Для цього звертаємось до меню «ПалитраИзменить палитруОпределить цвет» і у вікні, що з'явилося, знаходимо значення компонент RGB для вибраного кольору:






    • За допомогою калькулятора переводимо значення RGB з десятинного до шістнадцятирічного формата:








  1. Внесіть зміни у текст документа , щоб виконати заливання фону потрібним кольором, перегляньте результат в Internet Explorer;

  2. Запишіть документ HTML до папки «ЛР-2» з іменем «Задание 3».
^

Критерії оцінювання


Оцінка «5» – виконання 12 пунктів завдання|задавання|

Оцінка «4» – виконання 10 пунктів завдання|задавання|

Оцінка «3» – виконання 8 пунктів завдання

|задавання|
^

Список літератури


  1. Березин С. В.. Раков С. В Internet у вас дома. — СПб.: BHV-Петербург, 2000.

  2. Денисов A. Microsoft Internet Explorer 5. — СПб.: Питер, 2000.

  3. Internet для "чайников" / Дж. Левин и др. — К.: Диалектика, 1997.

  4. Камер Д. Компьютерные сети и Internet. Разработка приложе­ний для Internet. — М.: Издат. дом "Вильямc", 2002.

  5. Олифер В. Г.. Олифер Н. А. Компьютерные сети. Принципы, технологии, протоколы. — СПб.: Питер, 2001.

  6. Соломенчук В Интернет: краткий курс. СПб.: Питер, 2000.

  7. Столлин,-с В. Беспроводные линии свят и сети. — СПб.: Издат. дом "Вильямc", 2003.

  8. Хелеби С., Ферсон Д. Принципы маршрутизации в Internet. 2-е изд. — СПб.: Издат. дом "Вильяме", 2001.

  9. Шиндер Д. Л. Основы компьютерных сетей. — СПб.: Издат. дом "Вильямc", 2002.
^

Методичне забезпечення


  1. Конспект лекцій.

  2. Рудь І.О., Карпенко М.Ю , Рябченко І.М., Волков Д.О.Методичні вказівки до виконання розрахунково-графічної роботи по дисципліні «Комп'ютерні мережі та телекомунікації» (для студентів спеціальності 6.050.201 «Менеджмент організацій», системи дистанційної освіти та іноземних студентів). – Харків: ХНАМГ, 2005


Зміст

Лабораторна робота 1. Побудова найпростішої HTML-сторінки 3

Мета роботи 3

Порядок виконання роботи 3

Критерії оцінювання 8

Лабораторна робота 2. Кольорове оформлення Web-сторінки 9

Мета роботи 9

Критерії оцінювання 12

Список літератури 13

Методичне забезпечення 13

Навчальне видання

Методичні вказівки до виконання лабораторної роботи «Використання HTML при розробці WEB-сторінки. Створення простого документа і засоби форматування» з дисципліни «Комп’ютерні мережі та комунікації» (для студентів 2 курсу спеціальності 6.050. 201 «Менеджмент організацій»). Укл.: Карпенко М. Ю., Уфимцева В. Б., Гомза Н.І. — Харків: ХНАМГ, 2007.—18 с.


Укладачі: Микола Юрійович КАРПЕНКО,

Вікторія Борисівна УФИМЦЕВА,

Надія Іванівна ГОМЗА.


Редактор: З.М. Москаленко

Коректор: З.I. Зайцева


Комп’ютерний набір і верстка:


План 2007, поз. 61


Підп. до друку ______ Формат 60х84 1/16 Папір офісний

Друк на ризографі. Умовн.-друк. арк. 1,0 Обл.-вид. арк. 1,4

Зам. № _____ Тираж 50 прим.


61002, Харків, ХНАМГ, вул. Революції, 12


Сектор оперативної поліграфії ІОЦ ХНАМГ


61002, Харків, вул. Революції, 12

i Документ HTML — це звичайний текстовий файл, у якому текст розмічено так званими тегами. Тег здебільшого складається з двох частин — відкриваючої і закриваючої. Наприклад:

^

що відкриває частину тега

Перший HTML документ студента групи МГКТС-1 Іванова Івана Івановича – тіло тега

закриваюча частина тега

Закриваюча частина тега відрізняється наявністю символа “/” (слеш).

Деякі теги| не мають закриваючої частини, наприклад, тег
.

Кожен HTML документ повинен мати стандартну структуру:


Вказує стандарту HTML, відповідно до якого створено документ. У нашому випадку даний запис означає, що документ створено відповідно до стандарту HTML 3.2Розпочинає HTML документ. Текст документу має знаходитись між відкриваючою і закриваючою частинами тега htmlПочинає заголовок HTML документа. У заголовку HTML документа вказують невізуальні (такі, що не відображуються) теги. У цьому розділі можна задати текст на панелі заголовку документа, або тип кодування, в якому створено документ і т.ін.Untitled Document



Необов'язкові теги, які можуть бути вказані у заголовку документа. Вони задають текст на панелі заголовка вікна Internet Explorer, кодування, в якому записано документ, а також назва додатку, за допомогою якого цей документ було створено.Закриває частину тега head, тобто завершує розділ заголовкуПозначає тіло документа. Текст документу має знаходитись між відкриваючою і закриваючою частинами тегу bodyЗакриває тег body, позначає| завершення розділу тіла документа.Закриває тег html.

Internet Explorer відображує документ відповідно до вказаних у ньому тегів. Деякі теги не мають візуального відображення, наприклад html, head, body та ін. Вони використовують для визначення логічної структури документа.

При розборі і подальшому відображенні Internet Explorer ігнорує всі переведення рядків, знаки табуляції, пропуски. Якщо у документі зустрічаються декілька пропусків, знаків табуляції, переведення рядків один за одним, всі вони будуть замінені на один символ пропуску. Внаслідок цього, теги і текст у документі можна вирівнювати переведеннями рядків і пропусками. Це не впливатиме на відображення документа.

Рекомендований стиль форматування документа: кожен вкладений тег має бути зміщений на 2 позиції ліворуч.


ii Текст у HTML документі в Internet Explorer відображують одним рядком, незважаючи на те, що в тексті можуть бути переноси рядків і символи табуляції. Для того, щоб змусити Internet Explorer перенести певний текст, треба вказати перед даним текстом тег|
(br – від англійського break – «розірвати»).


iii Теги h1, h2, h3, h4, h5, h6 використовують для створення заголовків у документі. Тег h1 створює|створіння| заголовок найвищого рівня з|із| найбільшим розміром символів, h6 – з найменшим (h1 . h6 – від англійського header – «заголовок»)

iv Тег| center вирівнює по центру документа Internet Explorer по горизонталі.

v Тег hr (від англійського horizontal) створює|створіння| горизонтальну лінію у документі .

vi Тег| b (від англійського bold - жирний) виділяє текст жирним.

vii Тег| i (від англійського italic - курсив) виділяє текст курсивом

viii Відкриваючі теги можуть мати атрибути, тобто додаткову інформацію про властивості елементу, які відображено на екрані. Атрибути записують всередині тега після його імені у вигляді окремого ключового слова або знаку "=" і параметра (значення атрибуту). Порядок запису атрибутів у тегові не суттєвий. Дія атрибуту триває від того моменту, як тег відкрито і до того, як тег закрито. Якщо тег не має парного, атрибут діє тільки всередині тегу.

При використанні тега можна задати різні атрибути: розмір шрифту (атрибут size=” ”), колір (атрибут color=” ”) і стиль (атрибут face=” ”) шрифту.

Крім того, для зміни розмірів шрифту є інші команди, більш придатні для збереження єдиного стилю оформлення документа (... для укрупнення і ... для зменшення).

Команда
...
примушує браузер виводити текст на екран так, як його записано у програмі зі всіма пропусками і кінцівками рядків.

ix Заливку фону встановлюють атрибутом bgcolor=” ”, вказаного в тегові, що задає область заливки. Наприклад задає колір заливки всього тіла HTML сторінки. Колір шрифту () і колір заливки (атрибут bgcolor=” ”) можуть бути задані двома способами: по імені кольору (white, darkblue, maroon) або розкладкою кольорової гами по RGB-складниках. Наприклад, білий колір може бути задано розкладкою #FFFFFF, де знак # показує, що запис ведеться у шістнадцятирічному форматі.

x Номер індивідуального варіанту заливки фону визначаться за номером у списку групы.


Схожі:

Г. В. Стадник методичні вказівки iconГ. В. Стадник Методичні вказівки
Методичні вказівки до виконання індивідуального семестрового завдання з дисципліни “Основи охорони праці” (для студентів 3 курсу...
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки
Методичні вказівки до виконання лабораторних робіт з розділу “Електробезпека” (для студентів денної І заочної форм Академії). Укл....
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки
Методичні вказівки до лабораторних робіт з курсу “Методи оцінки небезпечних І шкідливих виробничих чинників» (для студентів 4 курсу...
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки
Методичні вказівки до курсової роботи з дисципліни "Енергопостачання міст" (для студентів 2 курсу денної І 3 курсу заочної форм навчання...
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки
Методичні вказівки до лабораторних робіт з фізичної хімії (для студентів 2-3 курсів усіх форм навчання спеціальностей 092. 601; 092....
Г. В. Стадник методичні вказівки iconГ. В. Стадник Методичні вказівки
Методичні вказівки до лабораторних робіт з аналітичної хімії води (для студентів 1–3 курсів усіх форм навчання спеціальностей 070....
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки
Електротехнічні системи електроспоживання” та 050701 „Електротехніка та електротехнології”
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки
Електротехнічні системи електроспоживання” та 050701 „Електротехніка та електротехнології”
Г. В. Стадник методичні вказівки iconГ. В. Стадник методичні вказівки до самостійного вивчення дисципліни
Методичні вказівки до самостійного вивчення дисципліни «Інноваційний менеджмент» (для студентів 5-6 курсів денної та заочної форм...
Г. В. Стадник методичні вказівки iconГ. В. Стадник Методичні вказівки та завдання на контрольну роботу, програма курсу І вказівки до самостійної роботи з дисципліни
Методичні вказівки та завдання на контрольну роботу, програма курсу І вказівки до самостійної роботи з дисципліни "Фінанси підприємств...
Г. В. Стадник методичні вказівки iconГ. В. Стадник Газопостачання міста Методичні вказівки
Газопостачання міста: Методичні вказівки до виконання розрахункових робіт з дисциплін “Основи енергозабезпечення міст” та “Інженерне...
Додайте кнопку на своєму сайті:
Документи


База даних захищена авторським правом ©zavantag.com 2000-2013
При копіюванні матеріалу обов'язкове зазначення активного посилання відкритою для індексації.
звернутися до адміністрації
Документи