Часто встречаются задачи, когда элемент нужно позиционировать нестандартно. В таких случаях на помощь приходит position: absolute; А чтобы больше про него узнать можно прочитать статью 😏
https://dzen.ru/media/junocode/css-absoliutnoe-pozicionirovanie-position-absolute-641166f8a48a1c67ba925acf
https://dzen.ru/media/junocode/css-absoliutnoe-pozicionirovanie-position-absolute-641166f8a48a1c67ba925acf
Дзен | Блогерская платформа
[CSS] Абсолютное позиционирование - position: absolute
Статья автора «junocode - frontend junior community» в Дзене ✍: position: absolute - это свойство CSS, которое позволяет задать позицию элемента относительно его первого родительского элемента,...
👏5👍3❤1
В стилизации больших сайтов без переменных не обходится ни один верстальщик. А если вы не знаете что это такое, можно почитать 📰
https://dzen.ru/media/junocode/css-peremennye-v-css-6412b294e238aa1eaeaec0b5
https://dzen.ru/media/junocode/css-peremennye-v-css-6412b294e238aa1eaeaec0b5
Дзен | Блогерская платформа
[CSS] Переменные в CSS
Статья автора «junocode - frontend junior community» в Дзене ✍: Переменные в CSS - это именованные значения, которые могут быть повторно использованы в коде.
❤3👏1
❗️ С 24 марта по 31 марта у меня начинается отпуск! Но работы все равно нужно сдавать, их будут проверять другие кураторы, в этот срок, до встречи 😏
👏12👍2😢1
Forwarded from Frontend Flow
Есть вопросы по работе с GIT?
Вы всегда сможете их задать в специальном чате 👍🏻
https://t.me/joinchat/tGSlm7b_y4U1MmQy
Вы всегда сможете их задать в специальном чате 👍🏻
https://t.me/joinchat/tGSlm7b_y4U1MmQy
👍5
Frontend Flow
Photo
Что будет выведено в консоль при выполнении следующего кода?
Anonymous Quiz
0%
{ x: 1, y: 2 }
52%
{ y: 2, z: 3 }
4%
{ x: 1, z: 3 }
43%
{ x: 1, y: 2, z: 3 }
Frontend Flow
Что будет выведено в консоль при выполнении следующего кода?
Пояснение:
Синтаксис деструктуризации объектов позволяет извлекать отдельные свойства объекта и сохранять их в переменных.
В данном случае, переменная x будет содержать значение свойства
Оператор
В результате, при выполнении{ y: 2, z: 3 } .
Синтаксис деструктуризации объектов позволяет извлекать отдельные свойства объекта и сохранять их в переменных.
В данном случае, переменная x будет содержать значение свойства
x объекта obj, а переменная rest будет содержать оставшиеся свойства объекта obj.Оператор
... перед переменной rest используется для сбора всех оставшихся свойств объекта в новый объект.В результате, при выполнении
console.log(rest) будет выведен объект, содержащий только оставшиеся свойства объекта obj, то есть 👍5👏1
Какие единицы измерения ширины и высоты в CSS используются для создания адаптивной (responsive) верстки?
Anonymous Quiz
9%
Пиксели (px)
46%
Проценты (%)
9%
Эмы (em)
36%
Все перечисленные единицы
😁4
Frontend Flow
Какие единицы измерения ширины и высоты в CSS используются для создания адаптивной (responsive) верстки?
Пояснение:
Единица измерения используется для задания фиксированной ширины и высоты элементов в пикселях.
Единица измерения используется для задания относительной ширины и высоты элементов в процентах от ширины и высоты родительского элемента.
Единица измерения используется для задания относительной ширины и высоты элементов на основе размера шрифта, установленного для родительского элемента.
Адаптивная (responsive) верстка использует единицы измерения, которые могут адаптироваться под различные экраны и разрешения, такие как и .
pxЕдиница измерения
%Единица измерения
emАдаптивная (responsive) верстка использует единицы измерения, которые могут адаптироваться под различные экраны и разрешения, такие как
%em👍1
Собираем статистику по студентам, которые уже устроились на свою первую работу, в IT. Начиная с 01.01.2023
Anonymous Poll
2%
Устроился на работу! (после 01.01.2023)
98%
Пока учусь/Ищу
😢17
Студенты, которые уже устроились на работу, напишите мне пожалуйста в тг https://t.me/ruslan_js
На пару вопросов, для статистики)
На пару вопросов, для статистики)
Telegram
Ruslan
You can contact @ruslan_js right away.
Всем привет! Я, к сожалению, заболел. Поэтому какое то время меня будут подменять другие кураторы 😓
😢16💊9😭2
Всем привет!
Сегодня буду записывать новые видео-рекомендации по курсу. Планируются записи по материалам:
2️⃣ 2-го модуля (html теги)
3️⃣3-го модуля (базовая разметка и классы)
7️⃣7-го модуля (базовый flexbox)
1️⃣1️⃣11-го модуля (hover/focus/active по обычным элементам и SVG)
1️⃣2️⃣12-го модуля (базовая верстка и подготовка проекта по обновленному макету + базовый БЭМ)
1️⃣3️⃣13-го модуля - базовые знания по адаптиву
Сегодня буду записывать новые видео-рекомендации по курсу. Планируются записи по материалам:
2️⃣ 2-го модуля (html теги)
3️⃣3-го модуля (базовая разметка и классы)
7️⃣7-го модуля (базовый flexbox)
1️⃣1️⃣11-го модуля (hover/focus/active по обычным элементам и SVG)
1️⃣2️⃣12-го модуля (базовая верстка и подготовка проекта по обновленному макету + базовый БЭМ)
1️⃣3️⃣13-го модуля - базовые знания по адаптиву
👍19🔥12👎2
Пример "Евклид": Как сделать адаптив левого блока, в секции "О нас".
https://stackblitz.com/edit/web-platform-n2oqhb?file=index.html
https://stackblitz.com/edit/web-platform-n2oqhb?file=index.html
StackBlitz
Евклид - адаптив левого блока (О нас) - StackBlitz
Пример: как сделать адаптивный левой блок, в секции О нас.
👍4❤🔥1👏1