Фронтенд Гайд
7.21K subscribers
624 photos
309 videos
297 links
Канал для фронтендеров, много полезных лайфхаков, фичей, макетов, тестов!

Все представлено в виде готового кода, бери и юзай в своем проекте.

По всем вопросам: @it_dashka
Реклама: https://telega.in/channels/frontend_dev5/card
Download Telegram
Как изменить размер фонового изображения с помощью CSS3?
Anonymous Quiz
83%
background-size: 80px 60px;
5%
background-proportion: 80px 60px;
3%
alpha-effect: bg-resize 80px 60px;
9%
Нет верного ответа
👍3
This media is not supported in your browser
VIEW IN TELEGRAM
Avatar input

Иконка Аватара с возможностью добавления своего из галереи.

#CodePen
👍1
👍61
screenshot-to-code

Приложение превращает скриншоты в HTML и CSS код, используя GPT-4 Vision для генерации кода и DALL-E 3 для создания схожих изображений. Основано на React/Vite для интерфейса и FastAPI для серверной части, требует ключ API OpenAI для доступа к GPT-4 Vision.

#GitHub
👍31
Какие из этих операторов преобразования CSS3 являются допустимыми.
Anonymous Quiz
43%
matrix()
36%
modify()
11%
skip()
10%
simulate()
👍3
Какой префикс вам нужен, чтобы свойства CSS3 работали в старых браузерах Mozilla Firefox?
Anonymous Quiz
36%
-webkit-
58%
-moz-
4%
-o-
3%
-gecko-
👍3
В вертикальном смещении теней блока (-1) означает, что тень блока будет находиться ниже блока?
Anonymous Quiz
56%
Правда
44%
Ложь
В чем разница между движками и средами выполнения JavaScript?

Статья разъясняет различия между движками и средами выполнения JavaScript, а также обсуждает термины ECMAScript и JavaScript, объясняя их взаимосвязь и функциональность.

#Полезное
This media is not supported in your browser
VIEW IN TELEGRAM
3d css Booklet

3D книга с возможностью пролистывания страниц.

#CodePen
Каковы первые три значения text-shadow по порядку?
Anonymous Quiz
10%
vertical, blur, horizontal
16%
blur, vertical, horizontal
41%
vertical, horizontal, blur
32%
horizontal, vertical, blur
FastForward

Расширение браузера автоматически пропускает сокращенные ссылки, освобождая вас от необходимости тратить время на их расшифровку и достижение нужной страницы.

#GitHub
2
Какой фрагмент кода отсутствует при создании тени текста? #basicTextShadow p {text-shadow: 1px 1px 3px; }
Anonymous Quiz
58%
цвет
10%
элемент
15%
идентификационное имя
17%
высота тени текста
🗿51
Как создать закругленные углы с помощью CSS3?
Anonymous Quiz
3%
border[round]: 30px;
3%
corner-effect: round;
92%
border-radius: 30px;
2%
alpha-effect: round-corner;
👨‍💻 Готовимся к вопросам по вёрстке на интервью Frontend-разработчика: значения свойства display

Статья объясняет значения свойства display в CSS и их влияние на расположение элементов на веб-странице, включая block, inline, flex, inline-flex, grid и inline-grid. Она также обсуждает особенности свойств width, height и margin для различных значений display, а также способы исправления возможных проблем с их поведением.

#Полезное
Какое ключевое слово используется для создания объекта в Java?
Anonymous Quiz
46%
object
41%
new
9%
create
5%
instance
👌1
Как быстро изучить JavaScript и ReactJS?

Привет! Я Андрей Шопинский — Frontend-разработчик из крупного Российского банка.

⚠️ 26 апреля в 18:30 по МСК я проведу бесплатный эфир в своём Telegram-канале про Frontend-разработку!

На трансляции будут раскрыты следующие темы:
— Как перейти от вёрстки к освоению JS;
— Зачем нужен ReactJS и как быстро его изучить;
— Секрет скоростного обучения в IT-сфере.

🔥 Ты сможешь задать свои вопросы в прямом ЭФИРЕ! 

Подписывайся на канал, чтобы не пропустить!

Реклама. Шопинский Андрей Олегович ИНН 312834439322. erid: LjN8KTYvM
3👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Leaping Like

Виджет с четырьмя реакциями с анимацией.

#CodePen
This media is not supported in your browser
VIEW IN TELEGRAM
eyeroll

Это расширение для Firefox, позволяющее прокручивать веб-страницы с помощью моргания глазами. Закройте правый глаз для прокрутки вниз и левый глаз для прокрутки вверх. Можно настроить чувствительность и время прокрутки. Работает и в Firefox для Android.

#GitHub