Будь умным!


У вас вопросы?
У нас ответы:) SamZan.ru

59141

Работа добавлена на сайт samzan.ru: 2016-03-13


Структура html-документу

<html>

<head>

<title>Заголовок документа</title>

</head>

<body>

Текст, що відображається на екрані

</body>

</html>

Заголовки

<h1> <h6> текст </h1></h6>

Вирівнювання заголовків – атрибут align

<h2 align=center \ right \ left>Teкст заголовка</h2>.

Абзац

<p>абзац </p>

Вирівнювання абзаців

<p align="center">текст</p>

<p align="left">текст</p>

<p align="right">текст</p>

<p align="justify">текст</p>

Після </p> автоматично здійснюється перехід на новий рядок

Просте вирівнювання по центру

<center> текст </center>

Коли не потрібен перехід на новий рядок використовують тег

<div></div>

<div align="center"> текст </div> …

Один абзац не може містити в собі інші абзаци та тег <div></div>.

Однак тег <div></div> може містити в собі абзаци, наприклад

<div align="right">

<p>текст первого абзаца</p>

<p>текст второго абзаца</p>

<p>текст третьего абзаца</p>

</div>

<br>  - перехід на новий рядок без створення абзацу

<hr> горизонтальна лінія

Атрибути горизонтальної лінії

<Hr align="right"> (center або left)

<Hr width="30%"> (ширина лінії у процентах або пікселях)

<Hr size="6"> (товщина лінії)

<Hr NoShade> (відміна обємності)

<Hr color="cc0000"> (колір лінії, лише у  IE)

Спецсимволи

&lt; - <

&gt; - >

&quot; - "

&nbsp; - пробел

&amp; - &

<!—коментарі для пояснень-->


Атрибути тегу
 <body>

background="url" — замість url вказують адресу малюнка, який має бути тлом для сторінки;

bgcolor=значення — задає колір, який має бути фоновим для документа;

text=значення — задає колір тексту;

link=значення — визначає колір гіперпосилань у документі;

alink=значення — задає колір гіперпосилань під час клацання;

vlink =значення — задає колір переглянутих гіперпосилань.

Якщо потрібно помістити в документ відформатований текст, для якого браузер повинен зберегти всі пропуски, навіть якщо кілька пропусків розміщені один за одним, знаки переносу на інший рядок, табуляції та інші символи форматування, використовують тег <pre>текст</pre>.

Теги форматування тексту

<b> та </b> Напівжирне накреслення

<i> та </i> Курсивне накреслення

<u> та </u> Підкреслене 

<s> та </s> Перекреслене 

<sup> та </sup> Верхній індекс 

<sub> та </sub>

параметри шрифту

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

face="значення" — гарнітура.

size=значення — розмір шрифту (ціле число від 1 до 7).

color=значення — колір шрифту.

Значення атрибутів size та color можна записувати без лапок.

тег <font атрибути>Текст</font>.

Атрибути цього тегу такі самі, як у тегу <basefont>, за винятком атрибута size: його значення зі знаком мінус (або плюс) означає, що розмір шрифту буде зменшено (чи збільшено) на відповідну величину відносно заданого за умовчанням або у тегу <basefont>. Значення без знака задає абсолютний розмір шрифту.

Інші теги

<big>Teкст</big> — збільшення розміру шрифту. Розмір символів тексту збільшується на одиницю відносно поточного рівня.

<small>Teкст</small> — зменшення розміру шрифту. Розмір символів зменшується на одиницю відносно поточного рівня.

<em>Текст</em> — виділення важливих фрагментів тексту. Текст відображатиметься курсивом.

<del>Teкст</del> — створення перекресленого тексту. Текст буде перекреслено горизонтальною лінією.

<marquee> «рухомий рядок» </marquee> —додають до веб-сторінки «рухомий рядок» із тексту, розташованого між ними.


Списки

Невпорядковані списки

<ul>

<li>перший елемент списку

<li>другий елемент списку

<li>…

</ul>

Тег <ul> може мати атрибут type , який визначає тип маркеру елементів списку

Цей атрибут набуває таких значень:

disk — зафарбоване коло;

circle — коло;

square — маленький чорний квадрат.

Впорядковані списки

<ol>

<li>Перша дія

<li>Друга дія

<li>…

</ol>

Тег <ol> може мати атрибут type, який визначає тип нумерації. Цей атрибут набуває таких значень:

• А — велика літера;

• а — мала літера;

• І — велика римська цифра;

• і — мала римська цифра;

• 1 — арабська цифра.

За допомогою атрибута start можна задати відмінний від одиниці початковий номер елемента, наприклад <ol type="1" start="5">

Списки визначень

<dl>

 <dt>Термін 1</dt>

   <dd>Визначення 1</dd>

 <dt>Термін 2</dt>

   <dd>Визначення 2</dd>

</dl>

Гіперпосилання

теги <а> текст посилання </а>, визначивши для тегу <а> атрибут href. Його значенням має бути адреса url, на яку вказує посилання..

зовнішнє (абсолютне) посилання  <а href="http://www.microsoft.com/">Microsoft</a>

внутрішнє (відносне) посилання   <а href="main.htm"> моя особиста сторінка </а>

посилання на якір  

<а href="#olenap"> кінці цієї сторінки</а>

<а name="olenap" href="mailto:olena@zirka.Iviv.ua"> 0lena@zirka.lviv.ua </a>


Таблиці

<table></table>

<tr></tr> - рядок таблиці

<td></td> - стовпчик (клітинка) таблиці

<th></th> - аголовки рядків або стовпчиків

<caption>  </caption> - заголовок таблиці (атрибут  align може мати значення top/bottom – заголовок перед або після таблиці)

Приклад – таблиця із 2 рядками і 2-ма стовпчиками

<table>

<tr>

<td>Перша клітинка</td>

<td>Друга клітинка</td>

</tr>

<tr>

<td>-Перша клітинка</td>

<td>-Друга клітинка</td>

</tr>

</table>

Для оформлення зовнішньої рамки таблиці можна використовувати атрибут FRAME тегу <TABLE>. Його значення визначають, що браузер відображатиме:

• box — всі чотири сторони рамки;

• above — лише верхню межу рамки;

• below — лише нижню межу;

• lhs — лише ліву межу;

• rhs — лише праву межу;

• hside s — верхню й нижню межі рамки;

• vsides — ліву й праву межі рамки;

• void — зовнішня рамка не відображатиметься.

Відображення розділювальних ліній між стовпцями та рядками таблиці визначають за допомогою атрибута RULES тегу <TABLE>. Він може набувати таких значень:

• all — відображати всі вертикальні та горизонтальні лінії;

• rows — лише горизонтальні лінії між рядками;

• cols — лише вертикальні лінії між стовпцями;

• none — не показувати розділювальних ліній.

Атрибути

bgcolor="колір" (може застосовуватись і до тегів <table> та <tr>)

align="center"(стандартні значення вирівнювання по горизонталі)

valign ="middle" (top, bottom) (вирівнювання по вертикалі)

height="висота в пікселях або відсотках "

width="ширина в пікселях або відсотках"

сolspan ="кількість стовпчиків" – кількість стовпчиків, які займає дана клітинка

rowspan="кількість рядків" – кількість рядків, які займає дана клітинка

Можна позбавитись від простору між клітинками таблиці. Для цього використовують атрибут cellspacing              <table cellspacing="0">

Для створення рамки таблиці використовують атрибут     border="товщина в пікселях"

bordercolor="колір"

bordercolorlight — колір світлої частини рамки;

bordercolordark — колір темної частини рамки.


Робота із зображеннями

<img src=”  ….  ”>

Може мати наступні атрибути:

height, widthвисота та ширина (у відсотках або пікселях)

altопис зображення

align вирівнювання (l e f t — зображення розміщене в лівій частині сторінки, текст обтікає його з правого боку; • r i g h t — зображення розміщене у правій частині сторінки, текст обтікає його з лівого боку; • top — обтікання немає, зображення розміщене в тексті, відповідний рядок якого вирівняно за верхньою межею малюнка; • bottom — обтікання немає, зображення розміщене в тексті, відповідний рядок якого вирівняно за нижньою межею малюнка; • middle — обтікання немає, зображення розміщене в тексті, відповідний рядок якого вирівняно по середній лінії малюнка.)

vspace, hspace – відстань по горизонталі та вертикалі між малюнком та текстом

titleпідказка, яка спливає при наведенні на зображення курсором

Карти-зображення (карти-посилання, навігаційні карти)

у тегу <img> визначають атрибут src, щоб задати зображення, і атрибут usemap, значенням якого є ім'я карти (має починатися символом #). власне карту створюють за допомогою тегу <mар> з атрибутом name, який містить ім'я карти (визначене в атрибуті usemap, але без символу #) та тегу </mар>. Між ними записують теги <area>, які задають параметри гарячих областей. При цьому використовують такі атрибути:

href — визначає гіперпосилання, пов'язане з областю;

 altопис області зображення, вказаної координатами;

titleпідказка, яка спливає при наведенні на вказану область курсором;

shape — визначає форму області (його значеннями можуть бути: • rect — прямокутник; • polygone або poly — багатокутник; • c i r c l e — коло; • coords — містить координати області у вигляді взятого в лапки списку чисел, розділених комою)

<img src="../files/223/bluerects.gif" usemap="#karta1">

……………………..

<map name="karta1">

<area href="drugoy_document.html" shape="rect" coords="25,36,114,98">

<area href="drugoy_document2.html" shape="circle" coords="46,48,35" alt=" маленьке коло " title=”маленьке коло”>

<area href="drugoy_document3.html" shape="poly" coords="168,9,232,29,200,97, 223, 129, 153, 119">

</map>


Фрейми

Фрейми – блоки або вікна веб-сторінки

Структура головного документу (main.html, index.html), що містить фрейми

<html>

<head>

<title>…..</title>

</head>

<frameset>……..</frameset>

</html>

<frameset></frameset> - задає розділ веб-сторінки на вікна, має атрибути    rows=”…” cols=”…”, які задають поділ документа на ряди та колонки (в пік селях або відсотках)

Те, що міститься у кожному фреймі, та яким чином воно буде відображатися у вікні, задає тег <frame> </frame> , він має наступні атрибути:

src="../files/223/….."  - шлях до того файлу, який буде відображатись у фреймі

scrolling="…."  - відображення полоси прокручування (no – заборона її відображення, auto – можна не прописувати)

noresize – заборона зміни розміру фрейму користувачем

border="" – задає ширину меж фреймів

bordercolor= “…” – задає колір меж фремів

marginwidth="…" marginheight="…." – встановлення ширини полів фреймів

name=”…” – задає ім’я фрейму (якщо воно задано, то при посиланні на документ, який повинен відкритися у даному вікні, використовується у тегу посилання атрибут                   <a …. target=”…”>  значення цього атрибуту – ім’я, яке попередньо вказали для даного фрейму)

Вбудовані фрейми задаються тегом <iframe> </iframe>

<iframe src="../files/223/…." width="…." height="…" scrolling="…" frameborder="…."></iframe>


Диплом на заказ


1. 1 Знание вечно оно не имеет ни начала ни конца и на самом деле ничегодругого и не существует
2. Целые числа - способы представления и хранения в ЭВМ, основные операции обращения с числами
3. Медитация как метод спортивной психологии
4. Повесть временных лет
5. Понятие и порядок формирования уставного капитала
6. Стань дизайнером своего лета 2012 01.html
7. задание Золушка На чём Золушка поехала на бал Отделить тыквенные семечки от семечек подсолнуха
8.  Этот рулет не только придется по вкусу гостям но и будет отличным украшением вашего стола
9. Сравнительный анализ индустрий развлечений Сочи и Владивостока
10. Міжнародний комерційний контракт та його місце У проведенні міжнародних комерційних операцій 5
11. Информационная система гостиничного комплекс
12. Способы рекультивации нефтезагрязненных почв и грунтов с упором на подходы биоремедиации
13. первых одна из главных задач трудового обучения в 57 классах состоит в том чтобы дать учащимся правильное пр
14. Арзамас
15. а ПРИНУДИТЕЛЬНЫЕ МЕРЫ МЕДИЦИНСКОГО ХАРАКТЕРА В УГОЛОВНОМ ЗАКОНОДАТЕЛЬСТВЕ НЕКОТОРЫХ ЗАРУБЕЖНЫХ СТРАН
16. Тема- Прекраснепозитивна цінність людини Прекрасне категорія естетики яка виражає представлення про
17. ПОНЯТИЕ И ИСТОЧНИКИ МЕЖДУНАРОДНОГО КОСМИЧЕСКОГО ПРАВА Международное космическое право представляет соб
18. Куда деваются отходы
19. На сегодняшний день несмотря на интенсивное развитие других видов транспорта улучшение сервиса железная
20. Такие оболочки есть и у других планет