Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Рубрика «css» - 21
Дайджест свежих материалов из мира фронтенда за последнюю неделю №420 (15 — 21 июня 2020)
2020-06-21 в 19:47, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендИспользование Grid для макетов страниц, а Flexbox — для макетов компонентов
2020-06-16 в 15:18, admin, рубрики: css, javascript, Блог компании RUVDS.com, разработка, Разработка веб-сайтовМой брат недавно отучился на компьютерщика и сейчас завершает стажировку в области фронтенд-разработки. Он узнал и о CSS Grid, и о CSS Flexbox, но в том, как он пользуется этими механизмами создания макетов, я отметил одну особенность, с которой я уже сталкивался. А именно, ему тяжело даётся принятие решений о том, когда использовать Grid, а когда — Flexbox. Например, он использовал CSS Grid для создания макета заголовка сайта. При этом он отметил, что довести проект до ума ему было нелегко, и что ему пришлось долго экспериментировать с grid-column и настраивать всё до тех пор, пока у него не получилось то, что ему было нужно.
Честно говоря, мне это не понравилось. Поэтому я решил поискать какой-нибудь ресурс, который помог бы моему брату как следует уяснить различия между Grid и Flexbox и дал бы возможность взглянуть на примеры, созданные с использованием обеих этих технологий. Но ничего подходящего мне найти не удалось. Тогда я решил написать статью, посвящённую Grid и Flexbox. Надеюсь, она получилась понятной.
Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №419 (8 — 14 июня 2020)
2020-06-14 в 19:57, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
PIXI.js создание кликера
2020-06-14 в 9:40, admin, рубрики: canvas, css, Gamedev, html, javascript, pixi.jsБольшинство тех, кто начинает изучать программирование, начали это из-за желания сделать свою игру. Нууу… я не исключение, но судьба меня занесла в веб разработку.
Цвета в CSS
2020-06-08 в 14:17, admin, рубрики: css, Блог компании RUVDS.com, дизайн, разработка, Разработка веб-сайтовЦвета играют жизненно важную роль в формировании внешнего вида веб-страниц. С помощью CSS мы можем управлять основным цветом элементов и их фоновым цветом. Для этого, соответственно, используются свойства color и background. Когда, много лет назад, я изучал CSS, мне не удалось найти доходчивого руководства по использованию цветов в CSS. Поэтому я решил написать такое руководство сам. В этом материале я расскажу о типах цветов и о ключевых словах, используемых при работе с цветами. Мы поговорим о том, в каких ситуациях используются те или иные методики работы с цветами и рассмотрим примеры. Сразу скажу, что здесь я не буду касаться теории цвета.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №418 (1 — 7 июня 2020)
2020-06-07 в 20:43, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Анализ производительности CSS-анимаций
2020-05-18 в 9:30, admin, рубрики: css, анимация, Блог компании RUVDS.com, Компьютерная анимация, Программирование, разработка, Разработка веб-сайтовЧто выбрать для анимирования элементов веб-страниц? JavaScript или CSS? Этот вопрос однажды вынужден будет задать себе каждый веб-разработчик. А может — и не однажды.
JavaScript-программисты создали множество библиотек для браузерной анимации. И, похоже, все вокруг оказались склонны к тому, чтобы использовать эти библиотеки в виде готового решения для анимации. Но давайте-ка притормозим. Правильно ли это? Следует ли анимировать элементы веб-страниц с помощью JavaScript? Может, можно положиться на стандартные механизмы CSS и добиться тем самым качественной и высокопроизводительной анимации?
Так как вы это читаете, я могу предположить, что вы знакомы с JavaScript-анимацией. Поэтому предлагаю исследовать тему CSS-анимации в разных её проявлениях, а так же — предлагаю поговорить о производительности такой анимации.
Читать полностью »
CSS-функции min(), max() и clamp()
2020-05-17 в 13:16, admin, рубрики: css, Блог компании RUVDS.com, разработка, Разработка веб-сайтовПоддержка CSS-функций сравнения min(), max() и clamp() появилась в Firefox 8 апреля 2020 года. Это означает, что данные функции теперь поддерживаются во всех основных браузерах. Эти CSS-функции расширяют наши возможности по созданию динамических макетов и по проектированию более гибких, чем раньше, компонентов. Их можно использовать для настройки размеров элементов-контейнеров, шрифтов, отступов и многого другого. Правда, веб-дизайнеру, создающему макеты страниц с учётом возможности использования этих восхитительных функций, может понадобиться научиться думать по-новому.
Сегодня я хочу рассказать об особенностях этих функций, объяснить всё то, что может оказаться в них непонятным, и привести практические примеры их использования.
Читать полностью »
Выделение и CSS
2020-05-04 в 10:45, admin, рубрики: css, Блог компании RUVDS.com, разработка, Разработка веб-сайтовНавык выделения текста и других объектов сформировался у пользователей компьютеров много лет назад. Мы выделяем содержимое веб-страниц по разным причинам. Возможно, нужно скопировать текст и где-то его процитировать, возможно — кому-то просто легче читать текст, выделяя его фрагменты. На мобильных устройствах, правда, выделять что-либо сложнее. Меня, например, это раздражает. Мне не нравится выделять содержимое веб-страниц на телефоне. Эта операция кажется какой-то «неправильной».
В этом материале я расскажу обо всём, что нужно знать о стилизации выделений средствами CSS. В частности, речь пойдёт о псевдоэлементе ::selection и о свойстве user-select. Эта статья направлена на то, чтобы показать всем желающим возможности CSS по работе с выделениями, и на то, чтобы рассказать о том, когда и как использовать разные методы работы с выделениями.
Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №413 (27 апреля — 3 мая 2020)
2020-05-03 в 20:29, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
