Используем CSS-фильтры для управления цветом изображений.
— grayscale() — бесцветность;
— hue-rotate(); — поворот цвета;
— saturate(); — насыщенность;
— sepia(); — сепия.
http://vanseodesign.com/css/4-css-filters-for-adjusting-color/
— grayscale() — бесцветность;
— hue-rotate(); — поворот цвета;
— saturate(); — насыщенность;
— sepia(); — сепия.
http://vanseodesign.com/css/4-css-filters-for-adjusting-color/
Подвели итоги одиннадцатого курса «Продвинутый HTML и CSS».
— Более 20 часов лекций, 4 преподавателя и 4 проекта.
— 26 наставников получили высшую оценку.
— 74 выпускника успешно защитили личные проекты.
В отчёте статистика потока и, конечно, отзывы участников.
> Записался, ждал этот интенсив и не прогадал: такого плотного графика в работе у меня никогда не было, даже в универе. Отличная подача материала на вебинарах, всё разжёвывается до мелочей. Критерии по вёрстке — очень дисциплинируют. Столько всего вкусного… Гитхаб, адаптивная графика, БЭМ, автоматизация, производительность и всё это в течение месяца с хвостиком. А, главное, теперь я это всё могу. Хотелось освоить препроцессоры и автоматизацию: теперь не знаю, как можно было без всего этого раньше. Невероятная прокачка навыков на интенсиве, спасибо Академия, было здорово.
https://htmlacademy.ru/blog/203-online-intensive-adaptive
— Более 20 часов лекций, 4 преподавателя и 4 проекта.
— 26 наставников получили высшую оценку.
— 74 выпускника успешно защитили личные проекты.
В отчёте статистика потока и, конечно, отзывы участников.
> Записался, ждал этот интенсив и не прогадал: такого плотного графика в работе у меня никогда не было, даже в универе. Отличная подача материала на вебинарах, всё разжёвывается до мелочей. Критерии по вёрстке — очень дисциплинируют. Столько всего вкусного… Гитхаб, адаптивная графика, БЭМ, автоматизация, производительность и всё это в течение месяца с хвостиком. А, главное, теперь я это всё могу. Хотелось освоить препроцессоры и автоматизацию: теперь не знаю, как можно было без всего этого раньше. Невероятная прокачка навыков на интенсиве, спасибо Академия, было здорово.
https://htmlacademy.ru/blog/203-online-intensive-adaptive
Что использовать для сброса стилей: Reset CSS или Normalize.css?
Для начала разберёмся зачем это вообще нужно делать.
https://www.youtube.com/watch?v=KGYmOlNteas&list=PLQJNT2fdCJngOj0mGZaTcZRyfSBTCWHe1&index=1?
Задавайте вопросы на странице — htmlacademy.ru/shorts или в комментариях к видео. На самые интересные мы ответим в следующих выпусках.
— О Normalize.css — https://htmlacademy.ru/blog/64-about-normalize-css
— Default style sheet for HTML 4 — https://www.w3.org/TR/CSS21/sample.html
— HTML5 Rendering — https://www.w3.org/TR/html5/rendering.html
— Chrome html.css — https://cs.chromium.org/chromium/src/third_party/WebKit/Source/core/css/html.css
— Firefox html.css — https://dxr.mozilla.org/mozilla-central/source/layout/style/res/html.css
— Reset CSS — https://meyerweb.com/eric/tools/css/reset/
— Normalize.css — https://necolas.github.io/normalize.css/
— CSS: all — https://developer.mozilla.org/en/docs/Web/CSS/all
Для начала разберёмся зачем это вообще нужно делать.
https://www.youtube.com/watch?v=KGYmOlNteas&list=PLQJNT2fdCJngOj0mGZaTcZRyfSBTCWHe1&index=1?
Задавайте вопросы на странице — htmlacademy.ru/shorts или в комментариях к видео. На самые интересные мы ответим в следующих выпусках.
— О Normalize.css — https://htmlacademy.ru/blog/64-about-normalize-css
— Default style sheet for HTML 4 — https://www.w3.org/TR/CSS21/sample.html
— HTML5 Rendering — https://www.w3.org/TR/html5/rendering.html
— Chrome html.css — https://cs.chromium.org/chromium/src/third_party/WebKit/Source/core/css/html.css
— Firefox html.css — https://dxr.mozilla.org/mozilla-central/source/layout/style/res/html.css
— Reset CSS — https://meyerweb.com/eric/tools/css/reset/
— Normalize.css — https://necolas.github.io/normalize.css/
— CSS: all — https://developer.mozilla.org/en/docs/Web/CSS/all
С помощью свойства transform, в CSS возможно масштабирование и поворот элемента целиком.
Но что, если вы хотите повернуть только фоновое изображение? Готового предложения в W3C для преобразования фонового изображения пока нет.
Автор предлагает выход из ситуации.
https://www.sitepoint.com/css3-transform-background-image/
Но что, если вы хотите повернуть только фоновое изображение? Готового предложения в W3C для преобразования фонового изображения пока нет.
Автор предлагает выход из ситуации.
https://www.sitepoint.com/css3-transform-background-image/
Совместно фоновые градиенты и плавные переходы в CSS просто так не работают.
Автор предлагает обойти эту особенность и добиться эффекта перехода с помощью плавного изменения непрозрачности псевдоэлементов.
http://keithjgrant.com/posts/2017/07/transitioning-gradients/
Автор предлагает обойти эту особенность и добиться эффекта перехода с помощью плавного изменения непрозрачности псевдоэлементов.
http://keithjgrant.com/posts/2017/07/transitioning-gradients/
Forwarded from Веб-стандарты
Выпуск №78: Chrome 60, Stylo, Flash 1996—2020, статистика браузеров, сброс стилей, большой текст, подсказки, порядок, новинки ES, должен ли? — https://soundcloud.com/web-standards/episode-78
Руководство по разработке веб-интерфейсов от команды приложения Grab.
Новые инструменты, библиотеки, фреймворки и плагины появляются каждый день, не все разработчики, участвующие в проекте, успевают следить за изменениями в фронтенде.
Это учебное пособие, которое позволяет понять принципы разработки в компании и влиться в работу быстрее.
https://medium.freecodecamp.org/grabs-front-end-guide-for-large-teams-484d4033cc41
Новые инструменты, библиотеки, фреймворки и плагины появляются каждый день, не все разработчики, участвующие в проекте, успевают следить за изменениями в фронтенде.
Это учебное пособие, которое позволяет понять принципы разработки в компании и влиться в работу быстрее.
https://medium.freecodecamp.org/grabs-front-end-guide-for-large-teams-484d4033cc41
Обзор проекта интенсива «Базовый JavaScript» — https://htmlacademy.ru/intensive/javascript. Всего на выбор два проекта.
«Кексобукинг» — сервис размещения объявлений о сдаче в аренду недвижимости в центре Токио. Предполагается, что пользователи размещают свои объявления или могут просматривать чужие.
70% учеников прошлого потока выбрали именно его, в качестве личного проекта.
https://www.youtube.com/watch?v=g_GtH7At8hs&list=PLQJNT2fdCJnhoGNGl-kIVbxiiyJRZOmZZ
«Кексобукинг» — сервис размещения объявлений о сдаче в аренду недвижимости в центре Токио. Предполагается, что пользователи размещают свои объявления или могут просматривать чужие.
70% учеников прошлого потока выбрали именно его, в качестве личного проекта.
https://www.youtube.com/watch?v=g_GtH7At8hs&list=PLQJNT2fdCJnhoGNGl-kIVbxiiyJRZOmZZ
Опыт разработки лендинга для набора инструментов Connect командой Stripe.
Применение CSS-гридов, 3D, анимации и других современных технологий.
https://stripe.com/blog/connect-front-end-experience
Применение CSS-гридов, 3D, анимации и других современных технологий.
https://stripe.com/blog/connect-front-end-experience
Обзор второго проекта интенсива «Базовый JavaScript» — https://htmlacademy.ru/intensive/javascript.
«Кекстаграм» — сервис просмотра изображений. Пользователи загружают свои фотографии или просматривают чужие.
Его выбрали 30% учеников прошлого потока.
https://www.youtube.com/watch?v=02O-70qjxxg&list=PLQJNT2fdCJnhoGNGl-kIVbxiiyJRZOmZZ
«Кекстаграм» — сервис просмотра изображений. Пользователи загружают свои фотографии или просматривают чужие.
Его выбрали 30% учеников прошлого потока.
https://www.youtube.com/watch?v=02O-70qjxxg&list=PLQJNT2fdCJnhoGNGl-kIVbxiiyJRZOmZZ
HTML Academy
Онлайн-курс «JavaScript. Профессиональная разработка веб-интерфейсов»
Курс разработан для тех, кто хочет сменить профессию и стать высокооплачиваемым профессионалом. Он подойдёт для работающих людей, у которых мало времени.
Опыт разработки веб-приложения для видеоконференций MeetSpace.
Собрав требования и проведя анализ навыков команды было принято решение использовать JavaScript без сторонних фреймворков.
Что из этого получилось и как.
https://www.smashingmagazine.com/2017/05/why-no-framework/
Собрав требования и проведя анализ навыков команды было принято решение использовать JavaScript без сторонних фреймворков.
Что из этого получилось и как.
https://www.smashingmagazine.com/2017/05/why-no-framework/