HTML: відмінності між версіями

Матеріал з Енциклопедія Драматика
Перейти до навігації Перейти до пошуку
Немає опису редагування
(Сторінка очищена)
Мітка: Очищення
Рядок 1: Рядок 1:
{{Stub}}


'''HTML''' ''(англ. '''H'''yper '''T'''ext '''M'''arkup '''L'''anguage)'' - стандартна мова розмітки у цих ваших [[Інтернети|інтернетах]]. Використовується абсолютно всюди, навіть у Драматиці, безосе!
== На пальцях ==
Фактично html складається з тегів (по типу ключових слів).
Теги необхідно закривати (<nowiki><tag></tag></nowiki>).
Деякі теги не треба закривати, наприклад <nowiki><img></nowiki>(імпортує на веб-сторінку зображення).
Виглядають вони десь так:
<code><nowiki><html>, <givno> і.т.д</nowiki></code>.
Кожен тег має певну функцію, наприклад, тег <code><nowiki><i></nowiki></code> робить текст курсивом:  <code><nowiki><i>Цей текст буде курсивом</i></nowiki></code>.
Для верстки веб-сторінок в основному використовують блоки <nowiki><div></nowiki> або таблиці <nowiki><table></nowiki>.
Ось приклад повноцінної веб сторінки (пробіли розставлені для читабельності) (<nowiki><!-- --></nowiki> - кометарі, які не впливають на веб сторінку.):
<pre>
<html><!--Головний тег хтмл, з нього починається все(може ще бути <!DOCTYPE>,
але вам це знати не треба)-->
<head><!--Початок голови документу(тут стилі, скрипти і т.д.)-->
    <title>Назва сторінки</title><!--Буде відображатись на вкладці браузера-->
</head><!-- Кінець голови -->
<body><!-- Початок тіла документу -->
    <div align="center"><!-- Вирівнювання по центру(<div> - це блок) -->
        Тут основний контент.
    </div>
</body><!-- Кінець тіла -->
</html><!-- І кінець документу -->
</pre>
Ось так.
== Короткий список тегів ==
(Тут лише <u>основні</u> теги)
{| align="center" class="wikitable" border="2" cellpadding="2"
|+
! |Тег
! |Значення
! |Приклад
|-----
| <nowiki><html></nowiki>
| Початок будь-якого документу
| <nowiki><html>Тут контент...</html></nowiki>
|-----
| <nowiki><head></nowiki>
| «Голова» документу. Тут зазвичай розміщують теги link та скрипти.
| <nowiki><head>...</head></nowiki>
|-----
| <nowiki><body></nowiki>
| «Тіло» документу. Тут розміщують основний контент (текст, зображення тощо).
| <nowiki><body>...content...</body></nowiki>
|-----
| <nowiki><script></nowiki>
| У цьому тегу розміщуються скрипти («сценарії»), які додають веб-сторінці інтерактивності. Зазвичай написані на [[Javascript]]
| <nowiki><script>var someFuckingShit="Hello, nigas";alert(someFuckingShit);</script></nowiki>
|-----
| <nowiki><link></nowiki>
| Цей тег використовується для привантаження на веб-сторінку стилів або іконок.
| <nowiki><link rel="stylesheet" href="styles.css" /><!--стилі...--><link rel="shortcut icon" href="favicon.ico" /><!--..іконка...--></nowiki>
|-----
| <nowiki><a></nowiki>
| Створює посилання на іншу веб-сторінку.
| <nowiki><a href="нахуй.html(це адрес посилання)">Що буде написано на посиланні</a></nowiki>
|-----
| <nowiki><i></nowiki>
| Робить курсивним текст.
| <nowiki><i>Цей текст буде курсивом</i></nowiki>
|-----
| <nowiki><u></nowiki>
| Підкреслює текст.
| <nowiki><u>Цей текст буде підкресленим</u></nowiki>
|-----
| <nowiki><s></nowiki>
| Закреслює текст.
| <nowiki><s>Закреслений текст</s></nowiki>
|-----
| <nowiki><p></nowiki>
| «Абзац». Нерідко використовується для групування елементів.
| <nowiki><p>Новий абзац</p></nowiki>
|-----
| <nowiki><span></nowiki>
| Використовується для групування елементів, додання до них стилей. Не найпопулярніший тег.
| <nowiki><span style="CSS-стиль">Тут цей стиль буде використано</span></nowiki>
|-----
| <nowiki><div></nowiki>
| Теж саме, що й span. Використовується набагато частіше.
| <nowiki><div style="CSS-style">Тут цей стиль буде використано</div></nowiki>
|-----
| <nowiki><img></nowiki>
| Завантаження зображення на сторінку.
| <nowiki><img src="адрес_зображення.png" /></nowiki>
|+
|}
== CSS ==
'''CSS''' - мова стилів для HTML.
=== Короткий мануал ===
CSS працює за селекторами. Селектором може бути ім'я тега, id блоку і багато чого іншого:
<pre>#id/*Це коментар. ID - айді блоку чи елемента до якого буде використано
стилі у фігурних дужках*/{font-weight: bold;/*Це перекладається як "Начіртаніє: Жирнає"*/}</pre>
== І що мені з цим робити? ==
Після створення html-документу у текстовому редакторі, збережи його з будь-яким ім'ям у форматі *.html або *.shtml або *.htm і відкрий його у будь-якому браузері. ТА-ДА!
==А ще?==
А ще в ХТМЛі можна правити - редагувати [[сайт рідного села]], написаний в [[Юкоз]]і (і не лише в Юкозі), о!
== Див. також ==
*[[BBcode]]
*[[Як написати статтю]]
== Посилання ==
*[https://www.w3schools.com/html/default.asp Мануал з хетемеля]
*[https://www.w3schools.com/css/default.asp Ще один мануал, але з цсс]
{{Айті|що=<!DOCTYPE html><html><head><titile>Твоя мама</title></head><body><p>Я їбав твою маму</p></body></html>}}

Версія за 19:41, 23 жовтня 2022

Отримано з https://drama.kropyva.ch/index.php?title=HTML&oldid=53120