HTML помощник

Сайт:	Информатикс
Курс:	2086 9М Информатика
Книга:	HTML помощник

Напечатано::	Гость
Дата:	Суббота, 14 Март 2026, 08:09

1. Старт

Общая структура HTML-документа:

<!DOCTYPE html>

<html>
<head>
<!-- Вспомогательная информация -->

<title> Это название страницы! </title>
</head>
<body>
<!-- Основная часть страницы -->
</body>
</html>

2. Форматирование текста

Синтаксис любого тэга:
<название_тэга> содержание </название_тэга>
<название_тэга название_атрибута1=значение1 название_атрибута2=значение2 ...>содержание</название_тэга>

Тэги для форматирования текста:

<b>, <strong>	Жирный
<i>, <em>	Курсив
<font size=12 color="red">, <font size=число color=цвет>	Изменение шрифта
<span>	Сам по себе он ничего не делает, но можно прикрепить к нему атрибуты
<br>	Символ переноса строки

К примеру,
<span style="font-size:30px; color:red"> Красный </span>
будет выглядеть как
Красный

Цвет можно указывать не только названием, но и с помощью rgb:

color="#ff0000"
color="rgb(255, 0, 0)"

Здесь можно выбрать цвет: https://www.w3schools.com/colors/colors_picker.asp

3. Параграфы, заголовки и таблицы

Тэги для создания простраств для текста:

<p>	параграф
<h1>-<h6>	заголовки
<table>	таблица

Синтаксис таблицы не так очевиден. К примеру для создания таблицы 2 на 2:


<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

Здесь <tr> означает строку, <td> - блок в строке, <th> - блок-заголовок.
У <td> есть атрибуты colspan rowspan, с помощью которых можно создать блок шириной (и/или высотой соответственно) более, чем в 1 ячейку. К примеру:

 

<table>
  <tr>
    <!-- Блок шириной в 2 столбца -->
    <td colspan=2> Длинный текст </td>
  </tr>
  <tr>
    <td>текст</td>
    <td>текст</td>
  </tr>
</table>

будет выглядеть так:

Длинный текст
текст	текст

Также присутствует атрибут border, с помощью которого можно задать размер границы, вплоть до нулевого.

4. Картинки

Основной синтаксис:
<img src="название_файла.jpg" width="ширина_в_пикселях" height="высота_в_пикселях">

5. Ссылки

Синтаксис:

<a href="адрес"> текст, картинка или даже <button></button> </a>

Адресом может быть:
1. Название файла
2. Название тэга. Для обращения к тегу нужно указать его id, написав # перед ним. Пример:
<p id="text"> bla-bla, bla-bla, bla-bla </p>
<a href="#text"> bla? </a>