update typescript, update docs

This commit is contained in:
2025-03-25 12:56:44 +03:00
parent 3ca85754d2
commit f26d9d8512
61 changed files with 467 additions and 80 deletions

View File

@@ -3,7 +3,6 @@ sidebar_position: 1
---
# Position
Источник: DeepSeek
Свойство position в CSS используется для определения способа позиционирования элемента на веб-странице. Оно позволяет управлять расположением элемента относительно его обычного положения в потоке документа или относительно других элементов.
@@ -48,4 +47,6 @@ sidebar_position: 1
- `z-index` работает только для элементов с позиционированием, отличным от `static`.
- `sticky` работает только если у родительского элемента есть высота, иначе поведение может быть непредсказуемым.
Использование свойства `position` позволяет гибко управлять расположением элементов на странице, создавая сложные макеты и интерактивные интерфейсы.
Использование свойства `position` позволяет гибко управлять расположением элементов на странице, создавая сложные макеты и интерактивные интерфейсы.
🚀 **_Источник: DeepSeek_**

View File

@@ -3,10 +3,11 @@ sidebar_position: 2
---
# Сетка flexbox, grid
Источник: DeepSeek
Предназначены для создания гибких и адаптивных макетов.
## Flexbox
Flexbox (Flexible Box Layout) — это мощная модульная система CSS, предназначенная для создания гибких и адаптивных макетов. Она позволяет легко выравнивать элементы, распределять пространство и управлять их поведением в контейнере, даже если размеры элементов неизвестны или динамически изменяются.
Flexbox — это одномерная система компоновки, предназначенная для выравнивания элементов по одной оси (горизонтально или вертикально).
#### Основные концепции Flexbox
@@ -25,7 +26,7 @@ Flexbox работает с двумя основными сущностями:
- Для создания адаптивных интерфейсов.
## Grid
**CSS Grid Layout** (или просто **Grid**) — это мощная система для создания двумерных макетов в CSS. В отличие от Flexbox, который работает с одномерными макетами (либо строка, либо столбец), Grid позволяет управлять как строками, так и столбцами одновременно. Это делает Grid идеальным инструментом для создания сложных, адаптивных сеток.
Grid — это двумерная система компоновки, позволяющая работать и с колонками, и со строками одновременно.
#### Основные концепции Grid
1. **Grid Container** (контейнер) — элемент, который содержит дочерние элементы (grid items). Чтобы сделать элемент grid-контейнером, нужно задать ему свойство `display: grid` или `display: inline-grid`.
@@ -43,4 +44,6 @@ Flexbox работает с двумя основными сущностями:
#### Когда использовать Grid:
- Для создания двумерных макетов (например, страницы с боковой панелью, заголовком и футером).
- Когда нужно точно контролировать расположение элементов.
- Для создания адаптивных интерфейсов с минимальным количеством медиазапросов.
- Для создания адаптивных интерфейсов с минимальным количеством медиазапросов.
🚀 **_Источник: DeepSeek_**

View File

@@ -4,8 +4,6 @@ sidebar_position: 3
# Семантические тэги
Источник: DeepSeek
Семантические теги HTML — это теги, которые четко описывают их содержимое и предназначение, делая код более понятным как для разработчиков, так и для поисковых систем. Они помогают улучшить структуру документа, упростить его чтение и повысить доступность для людей с ограниченными возможностями.
Основные семантические теги
@@ -64,3 +62,5 @@ sidebar_position: 3
- Для создания структурированных и понятных веб-страниц.
- Для улучшения доступности и SEO.
- Для упрощения работы с кодом в команде.
🚀 **_Источник: DeepSeek_**

View File

@@ -3,7 +3,6 @@ sidebar_position: 4
---
# Блочная модель
Источник: DeepSeek
**Блочная модель CSS** (или **Box Model**) — это фундаментальная концепция, которая описывает, как элементы HTML отображаются на веб-странице. Каждый элемент на странице рассматривается как прямоугольный блок, который состоит из нескольких частей: содержимого, отступов, границ и внешних отступов. Понимание блочной модели важно для управления размерами, расположением и отступами элементов.
@@ -58,3 +57,5 @@ sidebar_position: 4
- Блочная модель CSS состоит из **содержимого**, **внутренних отступов**, **границ** и **внешних отступов**.
- Свойство `box-sizing` позволяет управлять тем, как учитываются отступы и границы в размерах элемента.
- Понимание блочной модели важно для создания точных и предсказуемых макетов.
🚀 **_Источник: DeepSeek_**

View File

@@ -3,7 +3,6 @@ sidebar_position: 5
---
# Селекторы, специфичность
Источник: DeepSeek
**Специфичность селекторов** в CSS — это механизм, который определяет, какие стили будут применены к элементу, если на него влияют несколько конфликтующих правил. Специфичность рассчитывается на основе типа селекторов, и чем выше специфичность, тем выше приоритет стиля.
@@ -50,4 +49,6 @@ sidebar_position: 5
## Вывод
- Специфичность определяет приоритет CSS-правил.
- Инлайновые стили и !important имеют наивысший приоритет.
- Используйте классы и избегайте избыточной специфичности для поддержания чистоты кода.
- Используйте классы и избегайте избыточной специфичности для поддержания чистоты кода.
🚀 **_Источник: DeepSeek_**

View File

@@ -3,7 +3,6 @@ sidebar_position: 6
---
# Препроцессоры
Источник: DeepSeek
**Препроцессоры CSS** — это инструменты, которые расширяют возможности стандартного CSS, добавляя такие функции, как переменные, вложенность, миксины, функции и многое другое. Они позволяют писать более структурированный, поддерживаемый и удобный код, который затем компилируется в стандартный CSS. Если вы работаете над большим проектом, использование препроцессора может сэкономить время и усилия. Наиболее популярные препроцессоры: **Sass**, **Less** и **Stylus**.
@@ -72,4 +71,6 @@ sidebar_position: 6
2. **Кривая обучения:**
- Необходимо изучить новый синтаксис и возможности.
3. **Сложность отладки:**
- Скомпилированный CSS может быть сложнее отлаживать.
- Скомпилированный CSS может быть сложнее отлаживать.
🚀 **_Источник: DeepSeek_**

View File

@@ -3,7 +3,6 @@ sidebar_position: 7
---
# Единицы измерения в CSS
Источник: DeepSeek
В CSS существует множество единиц измерения, которые используются для задания размеров, отступов, шрифтов и других свойств элементов. Эти единицы можно разделить на несколько категорий: **абсолютные**, **относительные** и **специальные**.
@@ -112,3 +111,5 @@ sidebar_position: 7
- `vw` и `vh`: Для создания полноэкранных блоков или адаптивных шрифтов.
- `ch`: Для работы с текстом (например, ограничение ширины текстового поля).
- `deg`, `rad`, `turn`: Для трансформаций и анимаций.
🚀 **_Источник: DeepSeek_**