|
|
Основи програмування у Internet. Лек_01_HTML. Основи програмування у Internet
Основи програмування у Internet
16 лекцій
Лабораторні роботи:
Використання HTML.
Розробка свого сайту, за темою узгодженою з викладачем
1-ша частина – HTML 2.0
2-га частина – HTML 3.2
3-я частина – CSS
2. CGI-скрипт на языках:
Delphi
C
C++
Visual C
C под ОС UNIX
Visual Basic и др
Нельзя – Perl и PHP
Чотири лабораторні роботи на мові JavaScript
Увага!
В період залікової та экзаменаційної сесій – приймання однієї лабораторної роботи на протязі тижня.
Література:
1. М. Браун и др
«Использование HTML 4», 2004 г
2. Ст. Спейнаур, В, Куэрсиа
«Справочник Web-мастера»
«Справочник веб мастера»
3. Вайк Аллен и др
«JavaScript.
Энциклопедия пользователя»
«JavaScript. Справочник»
4. Д. Гудман
«JavaScript. Библия пользователя»
4е изд (2002 г) – 960 стр,
5е изд (2006 г) – 1184 стр,
5. П. Уилтон «Основы JavaScript»,
2002 г – 1056 стр
6. Д. Флэнагон
«JavaScript. Подробное руководство»
2004 г. – 960 стр
7. М. Дмитриева
«JavaScript. Самоучитель»,
2001 г – 512 стр
8. А. Павлов «CGI-программирование. Учебный курс», 2000 г. – 416 стр
9. Р. Колби «Освой самостоятельно CGI-программирование за 24 часа»
2001 г. – 368 стр
HTML
(мова розмітки гіпертексту)
Гіпертекст включає посилання на інші сторінки, списки, розділи, малюнки та ін
Гіпертекст – нелінійна структура тексту.
HTML – основа побудови сторінок сайту (web-сторінок, html-сторінок)
Ці сторінки знаходяться у файлах з расширенням .htm або .html
Проглядаються браузерами:
IE (Internet Explorer),
Opera ,
Google Chrome,
Firefox та ін.
Теги
У основі html мови лежать теги.
Тег – службове слово мови у кутових душках.
</b><br /> <b>Теги можна записувати як малими так і прописними літерами</b><br /> <br /> <br /> <number><br /> <br /> <br /> Якщо тег має закриваючий тег<br /> </html>, Текст сторінки <br /> Є атрибути, які присутні майже у будь-якому тезі, наприклад name<br /> За допомогою атрибута name можна працювати з html-сторінкою та тегами за допомогою мови JavaScript.<br /> <br /> <br /> <number><br /> <br /> <br /> Коментарій<br /> Для коментарію використовуються теги:<br /> <li> Багатостроковий текст<br /> -- ><br /> Браузер не інтерпретує текст, який знаходиться у цих тегах.<br /> <br /> <h2>Форматування тексту</h2> <br /> <number><br /> <br /> <br /> 1. <br /><br /> <ul> Перехід на нову строку. <br /> Браузер видаляє усі пробіли (крім одного) та сам форматує строки, виходячи із ширини екрана та його розширення.<br /> Наприклад, набраний текст:<br /> Слово1 слово2 слово3<br /> На екрані браузера буде мати вигляд:<br /> Слово1 слово2 слово3<br /> <br /> </ul> <br /> <number><br /> <br /> <br /> <ul> Для примусової разбивки текста на строки саме існує тег <br />.<br /> <b>! </b>Закриваючого тега у нього немає.<br /> 2. <br /><br /> Тег абзацу (тобто перехід на нову строку. Відступа немає ні в одному майже браузері). Інколи застосовують закриваючий <br />.<br /> <br /> </ul> <br /> <number><br /> <br /> <br /> <ul> 3. Заголовки у сторінці<br /> <h2>….. </h2> - найкрупніший<br /> --------------------------<br /> <h6> ….. </h6> - найменший фонт.<br /> <br /> У цих тегах можна застосовувати атрибути завдання разміру шрифта та вирівнювання. Наприклад, <br /> (можна також <i>left</i>, <i>right</i>).<br /> </ul> <br /> <number><br /> <br /> <br /> 4. Але для цього можуть бути і теги:<br /> <ul> а) <b>текст </b> жирним текстом б) <i> текст </i> курсивом в) <center>текст </center> вирівнювання по середині екрану або вікна.<br /> 5. <hr><br /> Задає горизонтальну лінію. Параметри задають ширину та висоту лініі у пікселях.<br /> <br /> </ul> <h2>Списки <br /> <number><br /> <br /> <br /> 1. Ненумеровані списки<br /> <ul>……. <br /><br /> Кожний елемент списку починається з тега <li>.<br /> Закриваючий тег можна не ставити, так як новий елемент або </ul> говорять про те, що елемент закінчується.<br /> </ul> <br /> <number><br /> <br /> <br /> Можна задавати тип елемента атрибутом type:<br /> disk<br /> ○ circle (за замовчуванням)<br /> □ square<br /> Для заміни маркера малюнком потрібно скористуватися каскадною таблицею стилів або насильно прописувати невеликі зображення.<br /> <br /> <br /> <number><br /> <br /> <br /> 2. Нумеровані списки<br /> <ol> …… </ol><br /> Для елемента <li> нумерація може бути:<br /> <ul> арабськими цифрами;<br /> римськими цифрами;<br /> буквами латиньского алфавіту (у верхньому або нижньому регістрах).<br /> <br /> </ul> <br /> 2. Нумеровані списки <br /> <ol> …… </ol> <br /> Можна задавати різні атрибути, такі як <i><b>reversed</b></i>, <i><b>start</b></i> і <i><b>type</b></i>. <br /> Атрибут <i>reversed</i> для нумерованого списку дозволяє сортувати цифри у зворотному порядку. <br /> Атрибут <i>start</i> для нумерованого списку дозволяє починати список не з 1, як це <a href="/bilet--zadano-tri-tochki-obchisliti-a-koordinati-vektoriv-ta-y/index.html" title="Білет № Задано три точки,. Обчислити: а координати векторів та їх довжини; б кут між векторами; в площу трикутника; г проекцію Задано трикутник вершинами,.">задано за замовчуванням</a>, а з будь-якої іншої цифри <br /> <br /> <br /> <number><br /> <br /> <br /> Цим нумерацію можна розпочинати з потрібної позиції. <br /> Наприклад, перший пункт буде п'ятим чи двадцятим. <br /> А за допомогою атрибута type можна задавати типи, які будуть задано замість арабських цифр. <br /> Для елемента <li> нумерація може бути: <br /> арабськими цифрами; <br /> римськими цифрами; <br /> <br /> <br /> <number><br /> <br /> <br /> <number><br /> <br /> <br /> ітерами латинського алфавіту (у верхньому чи нижньому регістрах). <br /> Для цього type = 1<br /> = i<br /> = I<br /> = a<br /> = A<br /> <br /> <br /> <number><br /> <br /> <br /> 3. Списки-визначення<br /> (списки-глосарії)<br /> <dl> …………….. </dl><br /> Кожний елемент складається з двох частин:<br /> <ul> <dt> - визначаєма частина,<br /> <dd> - визначальна частина.<br /> <br /> </ul> <br /> <number><br /> <br /> <br /> Можуть бути списки у списках:<br /> <ol>Курси<br /> <li>курс 1<br /> <li>курс 2<br /> <ul>Список<br /> <li>Іванов<br /> <li>Петров<br /> <li>Сидоров<br /> <br /><br /> <li>курс 3<br /> <br />Список<br /> <br /> <br /> <number><br /> <br /> <br /> <li>Коваленко<br /> <li>Остапенко<br /> <li> Сидоренко<br /> <br /><br /> </ol><br /> </ul> <br /> <number><br /> <br /> <br /> На экране браузера данные списки будут иметь вид:<br /> <br /> <h2>Посилання</h2> <br /> <number><br /> <br /> <br /> За допомогою них можна здійснювати:<br /> <ul> перехід на інший абзац всередині сторінки;<br /> перехід на іншу сторінку того каталогу, що й вихідна сторінка;<br /> перехід на іншу сторінку іншого каталога;<br /> перехід на іншу сторінку іншого сайта. <br /> <br /> </ul> <br /> <number><br /> <br /> <br /> 1. Для першого випадку застосовуються якорі (теги) <a> з атрибутом href.<br /> Наприклад, <br /> < a href=“my_page.html#metka1”><br /> Текст посилання<br /> <br /> <br /> <number><br /> <br /> <br /> На екрані браузера буде:<br /> <u>текст посилання</u><br /> Курсор поза посиланням – зазвичай “стрілка”,<br /> Курсор на посиланні – “долоня”.<br /> Але це можна налаштувати по своєму смаку (засобами Windows).<br /> <br /> <br /> <number><br /> <br /> <br /> Для такого переходу всередині сторінки повинна бути мітка з атрибутом name:<br /> Назва мітки старий варіант або <br /> Назва мітки новий варіант <br /> Мітка дає можливість одразу потрапляти всередину сторінки на потрібне місце, а не на ії початок.<br /> <br /> <br /> <number><br /> <br /> <br /> 2. Для другого випадка вказується адреси файлів:<br /> Назва посилання <br /> 3. Для третього випадка може бути:<br /> а) href=‘каталог/ім’я_файлу’<br /> Тут каталог є підкаталогом.<br /> <br /> <br /> <number><br /> <br /> <br /> б) href=‘../ім’я_файлу’<br /> Файл знаходиться у батьківському каталозі<br /> в) href=‘/ім’я_файлу’<br /> Файл знаходиться у головному каталозі сервера або користувача <br /> (в залежності від ОС)<br /> <br /> <br /> <number><br /> <br /> <br /> 4. Для четвертого випадка<br /> href=‘http://адреса_сайту/шлях/ім’я_файлу’<br /> адреса – IP-адреса (192.44.180.183)<br /> – DNS-ім’я (www.donntu.edu.ua)<br /> В загальному випадку значення атрибута href позначаеться як URL, де<br /> <br /> <br /> <number><br /> <br /> <br /> URL – унифіцирований локатор ресурса, який може бути таким:<br /> - схема (протокол) - http://, ftp:// и др;<br /> - адреса вузла (серверу);<br /> - порт (:8080). За замовчуванням у Інтернеті прийнят порт 80;<br /> - Шлях - каталоги у шляху відокремлюються прямими слешами (як в ОС UNIX)<br /> <br /> <br /> <number><br /> <br /> <br /> - назва файлу (ресурса);<br /> - мітка;<br /> - запрос (посля знака питання йдуть слова запросу).<br /> Якщо у посиланні вказати атрибут<br /> target=_blank<br /> то документ по цьому посиланню буде відкритий у новому вікні.<br /> <br /> </number></number></number></number></number></number></number></a></number></number></number></number></number></dd></dt></number></number></number></number></number></number></number></number></number></number></number></number></number> |
|
|
Скачать 0.89 Mb.