Технологии

INS (тег в HTML)

Что такое ins в html:

Определяет текст, который вставлен в документ. По умолчанию вложенный текст отображается подчёркнутым.

Атрибуты:

1. cite - Указывает ссылку на документ, где приведена причина редактирования текста и другие подробности.
2. datetime - Дата и время редактирования текста.

Как прописать ins в html:

<ul>
  <li><ins>Новый раздел</ins></li>
  <li><del>Удалена устаревшая статистика</del></li>
</ul>

INPUT (тег в HTML)

Что такое input в html:

Является одним из разносторонних элементов формы и позволяет создавать разные элементы интерфейса и обеспечить взаимодействие с пользователем.

Атрибуты:

1. accept - Устанавливает фильтр на типы файлов, которые вы можете отправить через поле загрузки файлов.
2. accesskey - Переход к элементу с помощью комбинации клавиш.
3. align - Определяет выравнивание изображения.
4. alt - Альтернативный текст для кнопки с изображением.
5. autocomplete - Включает или отключает автозаполнение.
6. autofocus - Устанавливает фокус в поле формы.
7. border - Толщина рамки вокруг изображения.
8. checked - Предварительно активированный переключатель или флажок.
9. disabled - Блокирует доступ и изменение элемента.
10. form - Связывает поле с формой по её идентификатору.
11. formaction - Определяет адрес обработчика формы.
12. formenctype - Устанавливает способ кодирования данных формы при их отправке на сервер.
13. formmethod - Сообщает браузеру каким методом следует передавать данные формы на сервер.
14. formnovalidate - Отменяет встроенную проверку данных на корректность.
15. formtarget - Определяет окно или фрейм в которое будет загружаться результат, возвращаемый обработчиком формы.
16. list - Указывает на список вариантов, которые можно выбирать при вводе текста.
17. max - Верхнее значение для ввода числа или даты.
18. maxlength - Максимальное количество символов разрешенных в тексте.
19. min - Нижнее значение для ввода числа или даты.
20. multiple - Позволяет загрузить несколько файлов одновременно.
21. name - Имя поля, предназначено для того, чтобы обработчик формы мог его идентифицировать.
22. pattern - Устанавливает шаблон ввода.
23. placeholder - Выводит подсказывающий текст.
24. readonly - Устанавливает, что поле не может изменяться пользователем.
25. required - Обязательное для заполнения поле.
26. size - Ширина текстового поля.
27. src - Адрес графического файла для поля с изображением.
28. step - Шаг приращения для числовых полей.
29. tabindex - Определяет порядок перехода между элементами с помощью клавиши Tab.
30. type - Сообщает браузеру, к какому типу относится элемент формы.
31. value - Значение элемента.

Как прописать input в html:

<input type="text" name="username" placeholder="Юзернейм">
<input type="password" name="password" placeholder="Пароль">

IMG (тег в HTML)

Что такое img в html:

Используется для вставки изображений на веб-страницы.

Атрибуты:

1. align - Определяет как рисунок будет выравниваться по краю и способ обтекания текстом.
2. alt - Альтернативный текст для изображения.
3. border - Толщина рамки вокруг изображения.
4. height - Высота изображения.
5. hspace - Горизонтальный отступ от изображения до окружающего контента.
6. ismap - Говорит браузеру, что картинка является серверной картой-изображением.
7. longdesc - Указывает адрес документа, где содержится аннотация к картинке.
8. lowsrc - Адрес изображения низкого качества.
9. src - Путь к графическому файлу.
10. vspace - Вертикальный отступ от изображения до окружающего контента.
11. width - Ширина изображения.
12. usemap - Ссылка на тег <map>, содержащий координаты для клиентской карты-изображения.

Как прописать img в html:

<img src="cat.jpg">

IFRAME (тег в HTML)

Что такое iframe в html:

Позволяет встраивать контент (например, веб-страницы, видео) прямо в ваш документ HTML.

Атрибуты:

1. align - Определяет как фрейм будет выравниваться по краю, а также способ обтекания его текстом.
2. allowtransparency - Устанавливает прозрачный фон фрейма, через который виден фон страницы.
3. frameborder - Устанавливает, отображать границу вокруг фрейма или нет.
4. height - Высота фрейма.
5. hspace - Горизонтальный отступ от фрейма до окружающего контента.
6. marginheight - Отступ сверху и снизу от содержания до границы фрейма.
7. marginwidth - Отступ слева и справа от содержания до границы фрейма.
8. name - Имя фрейма.
9. scrolling - Способ отображения полосы прокрутки во фрейме.
10. seamless - Определяет, что содержимое фрейма должно отображаться так, словно оно является частью документа.
11. src - Путь к файлу, содержимое которого будет загружаться во фрейм.
12. srcdoc - Хранит содержимое фрейма непосредственно в атрибуте.
13. vspace - Вертикальный отступ от фрейма до окружающего контента.
14. width - Ширина фрейма.

Как прописать iframe в html:

<iframe src="https://dimos.ru/" width="600" height="400"></iframe>

Другие атрибуты

sandbox
Это важный атрибут с точки зрения безопасности. Он позволяет контролировать, какие активности разрешены внутри <iframe>.

<iframe src="https://dimos.ru/" sandbox="allow-scripts allow-same-origin"></iframe>
Значение allow-scripts разрешает выполнение скриптов внутри фрейма, а allow-same-origin позволяет фрейму обращаться к ресурсам его исходной страницы.

loading
Атрибут loading может помочь с оптимизацией производительности и отложить загрузку iframe до тех пор, пока это не будет необходимо.

<iframe src="https://dimos.ru/" loading="lazy"></iframe>

allowfullscreen, allowpaymentrequest
allowfullscreen: позволяет встроенному контенту открываться в полноэкранном режиме.
allowpaymentrequest: позволяет встроенному контенту делать запросы на оплату.

title
Не забывайте об универсальных атрибутах, таких как title, которые способствуют улучшению доступности.

<iframe src="https://dimos.ru/" title="Example Content"></iframe>

I (тег в HTML)

Что такое i в html:

Используется для выделения текста курсивом.

Как прописать i в html:

<p>Это <i>курсив</i>, а это уже нет.</p>

Это курсив, а это уже нет.

<p>Это <i>очень</i> важно.</p>

<p>Слово <i>bonjour</i> означает «привет»</p>

<p>Я только что закончила читать <i>«Великого Гэтсби»</i>.</p>