Існують наступні логічні стилі: 


Мы поможем в написании ваших работ!



ЗНАЕТЕ ЛИ ВЫ?

Існують наступні логічні стилі:



< DFN > - служить для опису визначення (терміну). <DFN> Це визначення. </DFN> Це визначення.

< EM > - служить для виділення тексту, що має особливе значення (друкарський наголос, виводиться курсивом). < EM > Це виділене слово. </EM > Це виділене слово.

< CITE > - служить для виділення заголовків книг, фільмів, цитат і тому подібне Дана інформація виводиться курсивом. < CITE > Це цитата </CITE > Це цитата

< CODE > - служить для виділення програмних код, текстів програм і тому подібне Виводиться моноширинним шрифтом. < CODE > The header file </CODE > The header files

< KBD > - використовується при виділенні тексту, що позначає клавіатурне введення користувача. Може бути зображено жирним шрифтом (але в більшості браузерів зображається моноширинним шрифтом). < KBD > Введіть passwd </KBD > Введіть passwd

< SAMP > - використовується для машинних повідомлень або послідовності буквених символів. Зображається моноширинним шрифтом. <SAMP > Segmentation fault: Core dumped. </SAMP > Segmentation fault: Core dumped.

< STRONG > - служить для ОСОБЛИВОГО виділення слів. Зазвичай виділяється жирним шрифтом. < STRONG > Це дуже важливо!!! </STRONG > Це дуже важливо!!!

< VAR > - використовується для символьних змінних. < VAR > Це змінна. </VAR > Це змінна.

Існують наступні фізичні стилі:

Ви можете задати:

< B > виділений шрифт < /B > виділений шрифт

< BIG > крупний шрифт < /BIG > крупний шрифт

< SMALL > дрібний шрифт < /SMALL > дрібний шрифт

< SUB > нижній індекс < /SUB > нижній індекс

< SUP > верхній індекс < /SUP > верхній індекс (E = mc2)

< TT > (телетайп) моноширинний шрифт < /TT > моноширинний шрифт

< I > курсив < /I > курсив

< EM > курсив < /EM > курсив

< STRIKE > перекреслений шрифт < /STIKE > перекреслений шрифт

< U > підкреслення < /U > підкреслення

 

Параметри тегу <hr>

Нагадаємо, що тег <hr> використовується для створення горизонтальних ліній на Web – сторінці. Даний тег має такі атрибути:

· align - вирівнювання лінії. Приймає значення: left (вирівнювання лінії по лівому краю сторінки), center (центрування лінії), right (вирівнювання лінії по правому краю сторінки);

· width – ширина (довжина) лінії в пікселях або відсотках. Якщо значення параметру width задається в відсотках, то ширина лінії обчислюється відносно ширини вікна. Наприклад, запис <HR width = “25%”> приводить до відображення лінії шириною в одну чверть вікна браузера;

· size – товщина лінії. Значення цього параметру назначається в пікселях (від 1 до 175);

· noshade - скасовує рельєфність лінії;

· color – колір лінії. Колір визначається за допомогою стандартнихімен або у форматі RGB.

 

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

Завдання №1

1. Визвіть текстовий редактор Блокнот. Наберіть заголовок документу й збережіть його в папці My Webs під іменем Прізвище. html (тут назва файлу – ваше особисте прізвище).

   <HTML>

           <HEAD>

                   <TITLE> Комп'ютерний клас </TITLE>

           </HEAD>

   </HTML>

 

2. Перегляньте створений вами документ за допомогою браузеру Internet Explorer.

Завдання №2

1. Відкрийте збережений вами документ попереднього завдання і створіть розділ змістовної частини, використовуючи різні заголовки:

 

<BODY>

<H1>ЛНПУ імені Тараса Шевченко </H1>

<H2> дозволить Вам стати висококласними фахівцями </H2>

</H3>в області Інтернет технологій</H3>

<P> Ми раді привітати Вас у нашім університеті й пропонуємо навчання по наступних спеціальностях:

</BODY>

 

2. Перегляньте створений вами документ за допомогою браузеру Internet Explorer. Після перегляду змінити останній рядок так, як показано нижче:

 

<HR> <P> Ми раді привітати Вас <P> у нашім університеті <BR>

і пропонуємо навчання на наступних спеціальностях:

 

Збережіть ваш документ та за допомогою Internet Explorer перегляньте, які зміни сталися в вашому документі.

3. Самостійно відокремте лініями назву університету (ЛНПУ імені Тараса Шевченко) і зробіть його накреслення курсивним. (Курсивний текст можна зробити за допомогою тегу <em>----</em>).

 

Завдання №3

За допомогою текстового редактору Блокнот створіть новий HTML – документ comic. html наступного вигляду:

 

<HTML>

   <HEAD>

           <TITLE> Комікси </TITLE>

   </HEAD>

   <BODY>

           <P> <H1> Комікси для дітей і не тільки </H1> <HR>

           <H2> <EM> Це весела сторінка </EM></H2>

           <H3> що зібрала всілякі добутки жанру коміксів, </H3> <HR>

           <P> як вітчизняних, так і закордонних <HR><HR>

           <P> Дедушка с внуком пошли в Интернет,

           <BR> Старец вернулся, а мальчика нет.

   </BODY>

</HTML>

 

Перегляньте створену сторінку comic. html в Internet Explorer.

 

Завдання №4.

1. Відкрийте створену в попередньому завданні сторінку comic. html в текстовому редакторі Блокнот.

2. Внесіть до сторінки comic. html наступні зміни:

· вирівняйте текст сторінки таким чином: перші два рядки - по центру, чотири рядки по правому краю.

· змініть колір тексту: перший рядок - червоний, другий і третій - коричневий; четвертий - зелений; вірш – синій;

· задайте гарнітуру шрифту Verdana, розмір шрифту у вірші – кожен рядок по зростанню від 3 до 6.

3. Набрати в кінці документу в розділі BODYрядок:

 

<P> Анекдоти <Sub> для дорослих </Sub> забавні картинки <Sup> для дітей </sup>

 

Переглянути документ comic. html за допомогою програми перегляду Web – сторінокInternet Explorer. Проаналізувати зміни, що сталися в документі.

 

Завдання №5.

Змініть сторінку comic. html наступним чином:

1) змініть основний шрифт за допомогою елементу <Basefont> таким чином: гарнітура шрифту - Arial, розмір шрифту - 4, колір шрифту – чорний;

2) змініть зовнішній вигляд ліній.

Перша лінія: товщина лінії - 5, колір лінії - малиновий

<hr size=5 color=magenta>.

Друга лінія: довжина - 60%, товщина лінії - 3, колір лінії - зелений, вирівняйте лінію по правому краю

<hr align= “right”>.

Третя лінія: довжина лінії - 80%, товщина лінії - 5, колір і вирівнювання лінії не змінюються

<hr align=right color=green size=5>

Завдання №6.

1. Створіть текстовий документ passion.txt в якому наберіть список ваших захоплень. Відформатуйте набраний текст.

2. Вставте відформатований текст із файлу passion.txt в документ comic. html. При цьому необхідно, щоб всі ознаки попереднього форматування тексту при перегляді сторінки comic. html були збережені.

3. Нижче наберіть цитату

...мне представляется, что человеческий мозг похож на маленький пустой чердак, который вы можете обставить, как хотите. Дурак натащит туда всякой рухляди, какая попадётся под руку, и полезные, нужные вещи уже некуда будет всунуть, или в лучшем случае до них среди всей этой завали и не докопаешься.

Шерлок Холмс (Артур Конан Дойль)

Зауваження

При виконанні завдання №6 необхідно скористатися елементом PRE.


Контрольні питання:

1. Що таке гіпертекстовий документ?

2. Які теги використовуються в заголовку Веб документа?

3. Яка структура HTML документа?

4. За допомогою яких тегів можна задати або змінити шрифт?

5. Які Ви знаєте параметри тегів?


Лабораторна робота №2
Робота з графічними зображеннями на Web-сторінці. Списки

 

Мета: навчитися використовувати графічні зображення при оформленні HTML-документів. Навчитися створювати різні види списків у HTML-документі.

 



Поделиться:


Последнее изменение этой страницы: 2020-12-09; просмотров: 102; Нарушение авторского права страницы; Мы поможем в написании вашей работы!

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 18.222.240.21 (0.018 с.)