ПРАКТИЧНА РОБОТА

З МОВОЮ розмітки HTML

ДЛЯ web-сторінок В БЛОКНОТІ

Якщо матеріали web-сайту структуровані логічно за темами і мають базуватися на декількох сторінках з навігацією за допомогою гіперпосилань, то такий сайт реалізовують із застосуванням фреймів. Фрейм у перекладі з англійської означає кадр, рамка, прямокутна область. Фрейми поділяють вікно броузера на частини, в яких відображають зміст сторінок сайту. Кожній сторінці має відповідати свій html-файл. Кожна сторінка повинна мати логічний заголовок.

Фрейм в загальному означає структуру, що містить деяку інформацію.

Фрейм (HTML) – область вікна браузера для представлення окремої Web-сторінки.

Браузер – це програмне забезпечення для перегляду Web-сайтів, тобто для запиту Web-сторінок з Павутини, для їх обробки та виведення, для реалізації переходу від однієї сторінки до іншої.

Приклад: <Frameset Rows = "90%, 10%">

</Frameset>

</Frameset> Зауваження. ТРЕБА створити ще так

Перелік найпоширеніших дескрипторів

¤ Встановлення кольору фону та тексту

Приклади кодів деяких кольорів: FF0000 – червоний, FFFF00 – жовтий, 0000FF – синій, 00A854 – зелений

C0C0C0 – сірий, FF8000 – оранжевий/ Примітка: можна вживати англійські назви кольорів. /

Приклади

1) <body bgcolor=#FFFF00 text=#00A854> 2) <body bgcolor="blue" text="yellow">

¤ Задання розміру заголовку

<Hn> </Hn>, де n – число от 1 до 6. Приклад : <H1> Заголовок 1-ого рівня </H1>

¤ Встановлення назви, розміру та кольору шрифту

Текст

Атрибут SIZE задає розмір шрифту (по замовчуванні - 3). FACE - стандартное ім’я шрифта. Потрібно використовувати шрифти, встановлені на комп’ютері. В іншому випадку буде використовуватись шрифт, вписаний по замовчуванню (зазвичай це Times New Roman). COLOR - задає колір тексту (по замовчуванню – чорний - #000000). Колір тексту можна задавати як назвою, наприклад, red, blue та ін., так і в шістнадцятковому вигляді - #FF0000 (червоний).

Приклад: Текст червоного кольору, шрифтом Arial

¤ Встановлення абзацу і переходу на новий рядок. - встановлення абзацу; - перехід на новий рядок без створення абзацу. Ці теги закривати не обов’язково.

¤ Встановлення типу вирівнювання. Типи вирівнювань: LEFT - по лівому краю RIGHT – по правому краю CENTER - по центру, JUSTIFY – по ширині.

¤ Встановлення накреслення тексту. Жирний текст ; Курсив ; Підкреслений

<STRIKE> Перекреслений </STRIKE> .

¤ Встановлення виділення тексту кольором.

Приклад: Жовтий

¤ Промальовування горизонтальної лінії. <HR size =товщина width=ширина_у_відсотках>

Приклад: <HR SIZE=4 WIDTH=50%>

¤ Задання фонової картинки. <BODY BackGround= "назва_файлу.розширення"> Наприклад: <BODY BackGround= "See.bmp"> ; Зауваження. Вказується лише назва файлу, якщо малюнок знаходиться в тій же папці, що і html-документ. В іншому випадку вказується повний шлях.

Наприклад : <BODY BackGround= "D:\ Picture\ See.bmp"> ¤ Додавання “рухомого рядка” (“бегущей строки”)

<marquee> Текст </marquee>; Наприклад: <marquee> Усім привіт! </marquee>

¤ Додавання суцільно зафарбованої лінії. <HR noshade SIZE="ширина" WIDTH="довжина у %" COLOR="колір">

Наприклад: <HR noshade SIZE=5 WIDTH=80% color="darkblue">

¤ Додавання малюнка. <Img SRC="назва_мал.розширення"> ; Наприклад: <Img SRC="Roza.bmp">

¤ Створення посилання-малюнка, при натисканні на яку буде здійснюватись перехід до іншої Web-сторінки

<A Href ="назва_файла.htm"> <Img SRC="назва_мал.розширення"></A>. Наприклад: <A Href ="Avtor.htm">

<Img SRC="portret.bmp"> Відомості про автора </A>

¤ Створення словесної гіперзсилки на файл. <A href="назва_файлу.htm"> Текст зсилки </A> ; Наприклад:

<A href="Osnova.htm" > Назад </A>

¤ Створення пронумерованого списку

<OL TYPE="Вид_лічильника"> <LI> текст пункту 1 <LI> текст пункту 2 . . . . . </OL>

Види лічильників: А - великі латинські літери; а - маленькі латинські літери; І - великі римські літери; і - маленькі римські літери; 1 - звичайні цифри.

¤ Створення маркованого списку. <UL TYPE= "Тип_списка"> <LI> текст пункту 1 <LI> текст пункту 2 . .. </UL>

Типи списків: • disc; ° circle; square. Приклад: Коли вірус переходить в активну фазу, можливі такі ознаки: <UL TYPE= "disc"> <LI> зникнення файлів; <LI> форматування жорсткого диска; <LI> неспроможність завантаження файлів або операційної системи. </UL>

¤ Створення внутрішнього гіперпосилання. <A Href= #Назва_зсилки> Текст зсилки </А> Перед текстом, до якого будемо переходити при натисканні дописати: <A NAME="Назва_зсилки"> Текст </A>

¤ Встановлення кольору для зсилки (link), пройденої зсилки (vlink), активної зсилки (alink) <BODY link="колір" vlink="колір" alink="колір"> ; Наприклад: <BODY link="red" vlink="blue" alink="white">.

¤ Створення таблиць

<Caption> Заголовок таблиці </Caption>

<TR>

</TR>

<TR>

</TR>

</Table>

Приклад кодування таблиці.

<TR>

<TH> Заголовок стовпця 1</TH> <TH> Заголовок стовпця 2 </TH>

</TR>

<TR>

<TD> Ряд 1, стовпчик 1</TD> <TD> Ряд 1, стовпчик 2 </TD>

</TR>

<TR>

<TD> Ряд 2, стовпчик 1</TD> <TD> Ряд 2, стовпчик 2 </TD>

</TR>

</TABLE>

Пояснення. Caption – задання заголовку таблиці

<TR > </TR > - початок та кінець рядка

<TD> </TD> - початок та кінець комірки в даному рядку

ПРИКЛАД КОДУВАННЯ НАЙПРОСТІШОЇ ВЕБ-СТОРІНКИ на таблиці.

<HTML> <HEAD> <TITLE> СТОРІНКА УЧНЯ 11 класу ВАСИЛЯ РОЗУМНОГО</TITLE> </HEAD>

<BODY bgcolor=#FFFF00 text=#007754 face=arial,helvetica,sans-serif onload=drag link=#33BBFF vlink=#6600aa alink=#bbbbff > <A href="index1.html"> головна сторінка </A>

Cалони квітів</a></CENTER> Крамниці квітів</caption> <tr> <td align=center bgcolor=#FFFFFF> <a href=t1.html>тюльпани</a> • <a href=t2.html> троянди</a> • <a href=t5.html>кали</a> • </td></tr></table> </td></tr></table> <IMG src="C28.BMP"> <IMG dynsrc="cino.avi" border=”3” hspace=”6” vspace=”3” width=190 height=100 aling=”center” alt=”якийсь фільм”> <ПАМЯТКА: Коли квітка переходить в активну фазу, можливі такі ознаки: <UL TYPE= "disc"> <LI> зникнення цвіту; <LI> формування насінини; <LI> неспроможність самозапилення. </UL> <center> <marquee bgcolor=#FF4455 height=40 behavior=”slide” loop=5 direction=”right” scrollamount=4 > © 2010 Василь РОЗУМНИЙ Group Production. </marquee></center> <EMBED SCR=” muzon.wav” loop=2></BODY></HTML>

ПРИКЛАД КОДУВАННЯ НАЙПРОСТІШОЇ ВЕБ-СТОРІНКИ на фреймах.

<HTML> <HEAD> <TITLE> СТОРІНКА 1</TITLE> </HEAD> <Frameset Rows = "90%, 10%"> <Frameset Cols = "30%, 70%"> <Frame SRC="site1.html" NAME="left" <!- - АБО ЛІВИЙ АБО ІНША НАЗВА ФРЕЙМУ - -> SCROLLING="NO" <!- - АБО "YES" АБО "AUTO"- -> FRAMEBORDER="1" <!- - АБО "0" МЕЖА ФРЕЙМІВ Є, ЯКЩО "1", і НЕМАЄ, ЯКЩО "0"- -> BORDER="30" <!- - ТОВЩИНА МЕЖІ ФРЕЙМУ - -> MARGINHIGHT="10" <!- - ВІДСТУПИ ВІД МЕЖІ ФРЕЙМУ - -> MARGINWIDTH="10" <!- - ВІДСТУПИ ВІД МЕЖІ ФРЕЙМУ - -> NORESIZE <!- - НЕ МОЖНА ПЕРЕСУНУТИ МЕЖУ - -> BORDERCOLOR=C0C0C0> <Frame SRC="site2.html" Name="OsnStrFrame"> </Frameset> <Frame SRC="site2.html" Name="DodatkovoFrame"></Frameset></HTML>

Перспективні напрямки інтелектуалізації ІНТЕРНЕТ

Сьогодні ІНТЕРНЕТ - це велика і складну система, яка об'єднує мільйони вузлів та зв'язків, по яких транспортується інформація. Ця система складна настільки, що з точки зору синергетики, здатна стати самостійним носієм інтелекту. Враховуючи величезні інформаційні обсяги і значні обчислювальні ресурси у вузлах мережі, інтелектуальні здібності цього організму практично непередбачувані. При відсутності організуючої ідеї ІНТЕРНЕТ може назавжди залишитися хаотичним сховищем інформаційних потоків, не більш інтелектуальним, ніж телевізійна мережа. Цілком можливо, що на протязі декількох десятиріч всесвітня мережа буде розвиватися по екстенсивному шляху. Серед низки перспективних технологій, що розширюють можливості ІНТЕРНЕТ, можна виділити декілька взаємозв'язаних технологічних концепцій: технологію інтелектуальних агентів (Intelligent Аgents) та Push - технологію. Push - технологія сьогодні вже достатньо пророблена і стабільно розвивається. З її допомогою користувачі не тільки формують запити в режимі Опііпе але регулярно отримувати інформацію по заздалегідь розміщеним запитах. Для цього достатньо необхідно вибрати потрібний Іпіегпеї - канал, встановити бажаний період та час доби для обновлення. Надходження нової інформації будуть автоматично доставлятися на потрібний комп'ютер. Таким чином користувач завжди може бути в курсі найсвіжіших подій. Крім того сьогодні практично кожна фірма може організувати власний канал, що призначається для відкритого чи внутрішнього "мовлення".

Технологія інтелектуальних агентів в ІНТЕРНЕТ

Сьогодні перед користувачем постає задача шукати потрібну інформацію в невідомому і постійно наростаючому віртуальному інформаційному просторі. Якщо потрібно розв'язати яку-небудь складну, нетривіальну задачу, що зв'язано з використанням цілком екзотичних математичних методів, про які користувач має слабке уявлення, або ж вияснити який небудь маловідомий історичний факт (наприклад походження батьків відомої людини), або ж знайти та використати деяке програмне забезпечення, тоді подальші дії повинні проходити по такому сценарію (звичайно, якщо розвиток мережі піде в даному напрямку). Користувач активізує програму - агента на своєму комп'ютері і достатньо вільній формі описує задачу. Потім агент з'єднується з іншими агентами, щоб вияснити, що їм відомо про розв'язання поставленої задачі. Якщо знаходиться агент, якому відоме вирішення, тоді агент користувача відфільтровує знайдену інформацію з метою ідентифікації потрібних розв'язків і відсіює непотрібні дані. Якщо розв'язок не знайдено або ж є неповним, кожен з агентів звертається до сусідніх агентів, щоб взнати можливі адреси.

11 клас. Інформатика. Дистанційне навчання

вівторок, 3 вересня 2019 р.

ПРАКТИЧНА РОБОТА З МОВОЮ розмітки HTML

Технологія інтелектуальних агентів в ІНТЕРНЕТ

Немає коментарів:

Дописати коментар

вівторок, 3 вересня 2019 р.

ПРАКТИЧНА РОБОТА З МОВОЮ розмітки HTML

Технологія інтелектуальних агентів в ІНТЕРНЕТ

Немає коментарів:

Дописати коментар

вівторок, 3 вересня 2019 р.