Html для початківців

Все починається з голови.



  • Команди в HTML називаються тегами. Починаємо набирати документ з тега - назва мови. Природно, закінчити документ треба буде командою . Звертаю Вашу увагу на те, що HTML - подвійна команда, її треба закривати за допомогою /. але тільки В САМОМУ КІНЦІ документа, інакше все, що написано після неї просто не буде сприйнято.
  • Наступним номером йде - тобто голова документа.
  • за словом йде інформація, яка буде з'являтися на найвищій сходинці екрану. Природно, це має бути якась приємна річ. Або, на худий кінець, інформаційна. Наприклад, назва документа. Вона може включати до 40 символів, вважаючи прогалини. <TITLE> - команда, яку треба обов'язково закривати. Для цього використовується /. </li> <li><META NAME="" CONTENT=""> таких рядків в документі може бути багато, вони використовуються, в основному, для забезпечення роботи пошукових систем. Цей тег одинарний, закривати його не потрібно. <p>Встановлюємо колір фону; колір, розмір і форму букв основного тексту і посилань.</p><br> <ul> <li>Далі йде тeг зі словами body bgcolor (визначає колір фону), link (колір посилань), vlink (колір використаних посилань), alink (колір активних посилань). #ffffff білий колір, # 000000 чорний колір, # 808080 нейтральний сірий колір, # 0000ee яскраво-синій колір, як правило використовується для маркування гіпертекстових посилань, # 551a8b тьмяно-синій колір, як правило використовується для відпрацьованих посилань, # ff0000 червоний колір, зручний для позначення активних посилань, # c0c0c0 сріблястий колір, # 800080 пурпурового кольору, # 008000 зелений колір, # 00ff00 лимонний колір (лайм), # 808000 оливковий колір. # Ffff00 жовтий колір, # 0000ff блакитний колір. Для початку достатньо?<br> Визначники квітів стоять практично в будь-який графічній програмі (типу Фотошопа). Колір визначається шістьма знаками - від 0 до f. Перші два символи відповідають за червоний колір, третій і четвертий - за зелений, а два останні - за синій колір. Чим "старше" символ, тим інтенсивніше колір.<br> Ще коди кольорів можна подивитися тут:</li> </ul> <p>Фон можна замінити картинкою.</p> <br> <ul> <li>Видозмінюємо попередній рядок за допомогою команди BACKGROUND. risunok1.jpg можна використовувати готовий, а можна намалювати самим, наприклад в Paint. (Пуск-Програми-Стандартні-Paint). Малюнок (поки розбираємо приклади) краще зберегти в тій же самій папці, що і Домівка. Інакше доведеться вказати весь шлях до нього.<br></li> </ul> <p>Вставляємо картинки і фотографії.</p> <br> <ul> <li>За допомогою цього рядка Ви вставите картинку foto1.gif по лівому краю (ALIGN = LEFT), висота картинки (HEIGHT) буде 103 пікселя, ширина (WIDTH) 446 пікселів, ширина окантовки (BORDER) 10 пікселів. Якщо ці параметри й вказати, то картинка буде таким, яким воно і їсти - не збільшена і не зменшена, і розміщуватися буде без окантовки по лівому краю. Якщо треба розмістити картинку справа, пишемо RIGHT замість LEFT. </ul> <p>Порада від Викуси:<br> Щоб привести гігантський розмір відсканованої фотографії до нормального вигляду треба пошукати де-небудь в програмі що-небудь типу Image size - і там поміняти дозвіл десь до 72 пікселів на дюйм. А в фотошопі елементарно цей розмір змінюється.<br></li> </ul><br><br> <ul> <li>Слово "Олександра" з'явиться у вашому документі підкресленим, кольору, визначеного для лінків, і при натисканні на нього Ви переміститеся на сторінку під ім'ям sasha в папці (директорії) sasha. Як бачите, команду A HREF треба закривати за допомогою / А.<br></li> </ul> <br> <ul> <li>В результаті введення цього рядка вийде слово "одного разу", написане курсивом, "в студену" - жирним курсивом, "зимову" - просто жирним шрифтом, "пору" - звичайним шрифтом.<br>Одного разу в студенуюзімнюю пору. <br> Отже, для жирного шрифту використовуємо <B>, для курсиву - <I>, для їх скасування </B> і </I>. </ul> <p>Розміщуємо сторінку на сервері.</li> </ul> <p>Порада від Викуси:</p> <p>Дають місце під сторінки безкоштовно на www.hotmail.ru - 16Mb і поки без банерів.</p> <p>Порада від Викуси:</p> <p>Раніше я сторінки в FrontPage робила, але все люди, які знаються на web-дизайні, мене ногами за це били, так як, на кшталт, глючная програма, так що тепер і не знаю, яку програму краще порадити. Я зараз взагалі просто за образом і подобою відразу теги "словами" пишу.</p> <p>Порада від Каті С.</p> <p>Одним з найважливіших елементів HTML- документа є таблиці. Як правило, вони використовуються для того, щоб мати у своєму розпорядженні об'єкти в необхідних місцях. Цей сайт створений за допомогою таблиць.</p> <p>Таблиця відкривається тегом <TABLE>. а закривається тегом </TABLE>. Вся інформація, що міститься всередині таблиці повинна розташовуватися між цими тегами. У відкриваючому тезі таблиці слід помістити атрибут BORDER, який встановлює товщину лінії таблиці. Якщо BORDER = 0, то лінія таблиці видно не буде.</p> <p>Заготівля таблиці буде виглядати так: <TABLE BORDER=2> </TABLE></p> <p>Команда TABLE підтримує такі атрибути (далі все розглянуто на прикладах):</p> <p>ALIGN - задає вирівнювання тексту по горизонталі і може приймати значення: BLEEDLEFT (впритул наліво), LEFT (ліво) CENTER (по центру) RIGHT (вправо).</p> <p>BACKGROUND - Значним атрибута служить файл, що задає фонове зображення для таблиці. Працює не у всіх браузерах.</p> <p>BGCOLOR - Задає колір фону таблиці. Працює не у всіх браузерах.</p> <p>BORDER - Задає ширину окантовки таблиці в пікселях. Якщо значення атрибута дорівнює нулю, окантовка стає невидимою.</p> <p>CELLPADDING - Задає ширину порожнього простору (в пікселях) між вмістом таблиці і її окантовкою.</p> <p>CELLSPACING - Задає інтервал між осередками таблиці (в пікселях)</p> <p>HSPACE - Задає розмір порожнього простору в пікселях справа і зліва від таблиці.</p> <p>VSPACE - Задає розмір порожнього простору в пікселях над і під таблицею.</p> <p>WIDTH - Задає ширину таблиці в пікселях або у відсотках від ширини вікна.</p> <p>HEIGHT - Задає висоту таблиці в пікселях або у відсотках від ширини вікна.</p> <p>Тепер створимо внутрішню структуру таблиці. Горизонтальна табличная рядок задається тегами <TR> </TR>. і є основою побудови таблиці. Вертикальні стовпці таблиці організовуються в кожному рядку тегами <TD> </TD>. число пар цих тегів в рядку таблиці відповідає числу стовпців.</p> <p>команда <TR> підтримує такі атрибути:</p> <p>ALIGN: BLEEDLEFT (впритул наліво), LEFT (ліво) CENTER (по центру) RIGHT (вправо).</p> <p>BACKGROUND;<br> BGCOLOR;<br> BORDER;<br> VALIGN - Задає вирівнювання тексту по вертикалі і може приймати значення: TOP (по верхній частині) MIDDLE (по середній частині) BOTTOM (по нижній частині) BASELINE (за базовою лінії).</p> <p>команда <TD> підтримує такі атрибути:<br> ALIGN: BLEEDLEFT (впритул наліво), LEFT (ліво) CENTER (по центру) RIGHT (вправо).<br> BACKGROUND, BGCOLOR,<br> COLSPAN - Осередок таблиці розсується на кількість стовпців, зазначених в значенні атрибута.<br> NOWARP - Вимикає автоматичний розподіл по осередку. Відображатиметься лише та частина тексту, яка вміщується в осередку по довжині.<br> ROWSPAN - Осередок таблиці розсується на кількість рядків, зазначених в значенні атрибута.<br> VALIGN, WIDTH.</p> <p>Найпростіша таблиця три на три осередки в HTML виглядає наступним чином:</p> <h4>Схожі статті</h4> <ul> <li> <p><a href="/articles/makrame-dlja-pochatkivciv.php">Макраме для початківців</a></p> </li> <li> <p><a href="/articles/programming-delphi-iljustrovanij-samovchitel-po.php">Programming delphi - ілюстрований самовчитель по delphi 7 для початківців - створення довідкової</a></p> </li> <li> <p><a href="/articles/strafe-poradi-ta-pidkazki-dlja-pochatkivciv.php">Strafe - поради та підказки для початківців</a></p> </li> </ul> </div> </article> </div> </div> </div> <footer class="igrzom-footer clearfix"> <p>Copyright © 2024<br></p> </footer> </div> </div></body> </html>