HTML Academy
9.52K subscribers
5.55K photos
190 videos
4 files
3.5K links
Курсы по веб-разработке: вёрстка, программирование, работа и комьюнити.
Наш секретный бот @HTMLAcademyKeksobot.

Вопросы по обучению @htmlacademy_sales

Ролики на YT https://www.youtube.com/@HTMLAcademyTV
Ролики на VK https://vkvideo.ru/@htmlacademy
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Интерактивный туториал «Мастерская: карточка с анимацией 3D-переворота»

👉️️ https://htmlacademy.ru/demos/105

Пошагово создадим карточку, которая красиво переворачивается в 3D при наведении. А затем детально и наглядно препарируем принцип работы этого 3D-эффекта.

И как всегда, вы можете экспериментировать и менять код на каждом шаге!
👍27
Хотите проверить реальный уровень знаний по любимому стеку?

Наш партнер-работодатель, компания “Открытые решения”, поможет в этом. Пройдите бесплатный тест в Firstlink и выявите точки роста!

https://firstlink.osinit.com

А прокачать знания можно на тренажёрах HTML Academy, которые открыты всю текущую неделю благодаря партнёрам-работодателям.

https://htmlacademy.ru/special/open-week/2024/october
👍8
This media is not supported in your browser
VIEW IN TELEGRAM
Мастерская: анимированный звездопад на чистом CSS

Пошагово, с понятным объяснением каждого шага, нарисуем красивейшие звёзды и заставим их падать

https://htmlacademy.ru/demos/107
👍30🔥6👏1
Через час, в 19:00, начнётся лайв с компанией HTDev про обучение напрямую для работодателя.

Приходите на лайв, чтобы подробнее узнать о компании, программе обучения и вживую пообщаться с представителями компании.

Записаться на лайв можно по ссылке

https://htmlacademy.ru/events/live_htdev
👍3🔥2❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Фундаментальный интерактивный туториал про псевдоклассы :nth-child и :nth-of-type. Хотите стать мастером :nth-child? Этот материал для вас!

Детально разбирается синтаксис :nth-child(an + b). Есть примеры создания простых, сложных и комбинированных выборок элементов. Для каждой выборки даны примеры расчётов порядковых номеров.

https://htmlacademy.ru/demos/2
❤14👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Разбираемся как делать красивые градиентные рамки с помощью repeating-linear-gradient в новом интерактивном туториале.

https://htmlacademy.ru/demos/111
❤‍🔥16👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Наглядное исследование-визуализация «repeating-linear-gradient VS linear-gradient»

https://htmlacademy.ru/demos/113

Даже опытные разработчики не всегда знают, как работает повторяющийся линейный градиент, чем он отличается от обычного и в каких задачах он незаменим. Мы исправляем эту несправедливость.

На примере одной и той же задачи мы наглядно и детально разобрали отличия между repeating-linear-gradient и linear-gradient. Оказывается, repeating-linear-gradient крутейший инструмент в своём классе.

Исследование предназначено для опытных разработчиков, но будет полезно и начинающим.

#туториалотhtmlacademy #исследованиеотhtmlacademy
👍7❤‍🔥4❤1
Ваш ответ?
Anonymous Quiz
22%
fai
52%
undefined
26%
falseundefinedundefined
👍3
Вопрос, о котором нельзя забыть

Что окажется в консоли после выполнения этой бесконечно странной команды?
Мне лень учиться. Что сделать, чтобы полегчало?

Расконсервировали статью из ковидных (помните, был такой?) времён, когда все засели по домам и никуда не ходили.

А оказалось, что дело-то вообще было не в локдауне.

👉️️ Вспомнить, в чём было дело
👍22🌭1🤣1
Вопрос дня #2443

Заказчик прислал техническое задание, в котором разрешены всего три тега. Какой из них поможет добавить диаграмму на страницу?
Anonymous Quiz
66%
<figure>
13%
<illustration>
21%
<disgram>
👍14🤔3👎2
Свойство flex — полное руководство

Ультимативное и бесконечно наглядное руководство по сеткам на флексах.

Добавляйте в закладки и верстайте как следует.

👉️️️️ https://htmlacademy.ru/blog/css/css-flex
👍26❤3😁1
Вопрос дня #20394

Заказчик обожает розовые точки у ненумерованных списков и псевдоэлементы CSS. Что использовать, чтобы он дал ещё денег на проект?
Anonymous Quiz
62%
::marker
21%
:marker
17%
::point
🤣19😢9
Автоматизация вёрстки. npm, package.json

Автоматизация экономит разработчикам время и помогает находить ошибки.

Рассказываем, почему ещё автоматизация — добро.

👉️️ https://htmlacademy.ru/blog/js/automation
👍13
Middle-Weekend: Скидки до 50%!

Только три дня – с 11 по 13 октября – доступ к лучшим курсам и пакетам для мидлов со скидками до 50%.

Что тебя ждет:

– Курсы для мидлов: обнови свои знания и овладей самыми актуальными технологиями.
– Пакеты для мидлов: комплексные программы обучения с максимальной выгодой. Как получить скидку?

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

Не упусти шанс улучшить свои навыки и сделать следующий шаг в карьере!
🔥8👍2❤1👎1😁1
Вопрос дня #8945

Заказчик спрашивает, можно ли сделать так, чтобы чекбоксы на форме совпадали по цвету с окнами на его компьютере. Как ему помочь?
Anonymous Quiz
25%
accent-color: auto;
30%
accent-color: desktop;
45%
Это невозможно
❤8
This media is not supported in your browser
VIEW IN TELEGRAM
10 горячих клавиш VS Code, которые ускорят вашу работу

Горячие клавиши — добро, польза и экономия времени.

Разберёмся, как с их помощью упростить себе жизнь в Visual Studio Code.
❤16👍3
Вопрос дня #56791

Заказчик спрашивает, можно ли сделать так, чтобы текстовые поля на форме совпадали по цвету с окнами на его компьютере. Как ему помочь?
Anonymous Quiz
38%
accent-color: auto;
35%
accent-color: system;
26%
Это невозможно
🤣12👍1🤯1
Дизайн для верстальщиков. Частые ошибки дизайнеров и способы их исправить

Дизайн-макет без единой ошибки — это что-то из параллельной вселенной, где существуют идеальные процессы и идеальные инструменты, которые позволяют создавать его без единого недочета и упущения.

Но, мы живём в реальном мире. Дизайнер может что-то забыть, не перепроверить проект по чек-листу, не подумать о редких сценариях, ошибиться или просто чего-то не знать.

Какие ошибки встречаются чаще всего и как их решить верстальщику самостоятельно
🔥8👍5❤1