В моем браузере установлено около 30 расширений, которые упрощают жизнь и работу в интернете. В этой статье я хочу поделиться 10 актуальными расширениями Google Chrome для верстальщика, которые постоянно использую при разработке сайтов.
Рубрика «html» - 21
Заметки верстальщика: Полезные расширения Google Chrome в 2019 году
2019-10-17 в 13:52, admin, рубрики: accessibility, chrome extensions, Google Chrome, html, pageliner, perfect pixel, tabsbook, user css, Wappalyzer, Web Developer, wireframily, Блог компании Wrike, верстка сайтов, Разработка веб-сайтов, Расширения для браузеровЗнакомство с Sass модулями
2019-10-17 в 12:57, admin, рубрики: css, html, sass, scss, Веб-разработка, верстка, Разработка веб-сайтовПривет! Представляю вашему вниманию перевод статьи «Introducing Sass Modules» автора Miriam Suzanne.
Недавно в Sass появилась функциональность, которая вам знакома по другим языкам: модульная система. Это большой шаг вперед для @import
, одной из наиболее часто используемых функций в Sass. Несмотря на то, что существующая директива @import
позволяет вам подключать сторонние пакеты и разделять ваши стили на поддерживаемые элементы, у неё всё же есть несколько ограниченийЧитать полностью »
Как CSS Grid меняет представление о структурировании контента
2019-10-14 в 9:37, admin, рубрики: css, html, layout, верстка, Разработка веб-сайтовКаждый, кто хотя бы немного занимался созданием веб-сайтов, знает, что теги <div>
— являются важным строительным блоком для контроля над макетом.
HTML5 представил новые семантические элементы, чтобы помочь в этом. И хотя они являются фантастическим дополнением к языку, они немного похожи на украшение к нашему супу из <div>
элементов.
С приходом CSS Grid, нам больше не нужно полагаться на элементы <div>
для создания структуры страницы или даже более сложного компонента. Структура буквально определяется родительским элементом, а не тем, как расположено содержимое внутри него.
Это значит, что мы можем получить хороший простой макет, который структурирует содержимое, не обращая внимание на то, как оно изначально организовано с помощью элементов <div>
.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №384 (7 — 13 октября 2019)
2019-10-13 в 20:58, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Sass MediaScreen — Определяем девайсы на CSS
2019-10-10 в 20:11, admin, рубрики: css, gulp, html, media queries, sass, scss, препроцессоры, Разработка веб-сайтовЯ считаю, что в последнее время разница размера экранов между разными группами устройств всё больше размывается. Не смотря на это я попытался написать инструмент для определения, как групп устройств (мобильники, планшеты, лаптопы, десктопы), так и конкретных девайсов (iPhone 5, iPhone X, iPad Pro 12 и т.д.). Получилась, на мой взгляд, довольно удобная пачка SASS-миксинов. И что немаловажно, инструмент прост в использовании, а также позволяет расширять список устройств своим без правки исходников.
Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №383 (1 — 6 октября 2019)
2019-10-06 в 20:44, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Ускорение instagram.com. Часть 2
2019-10-01 в 11:15, admin, рубрики: html, javascript, Блог компании RUVDS.com, Клиентская оптимизация, разработка, Разработка веб-сайтовСегодня мы представляем вашему вниманию перевод второго материала из серии, посвящённой оптимизации instagram.com. Здесь речь пойдёт об улучшении механизма заблаговременного выполнения GraphQL-запросов и о повышении эффективности передачи HTML-данных клиенту.
→ Читать, затаив дыхание, первую часть
Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019)
2019-09-29 в 20:21, admin, рубрики: angular, css, ember, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, подкасты, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Где и как использовать мультиколонки (CSS Columns)
2019-09-29 в 18:10, admin, рубрики: css, html, layout, верстка, Разработка веб-сайтов
При всём ажиотаже вокруг технологий CSS Grid и Flexbox, часто упускается из виду другой метод разметки. В этой статья я хочу рассмотреть многоколоночный макет — часто называемый просто «Multicol» или «CSS Columns». Вы узнаете, для каких задач он подходит и какие нюансы следует учитывать при его использовании.
Читать полностью »
«WARNING: sanitizing HTML stripped some content» и как с ним правильно бороться
2019-09-27 в 14:14, admin, рубрики: angular, css, dom, dompurify, html, javascript, JS, sanitize, sanitizers, TypeScript, Блог компании Tinkoff.ru, Разработка веб-сайтовВсем, кому приходилось вставлять HTML содержимое в DOM в Angular, доводилось видеть это сообщение. Конечно, все мы получаем проверенное содержимое с нашего же сервера и просто хотим застилизовать сообщение об ошибке. Или вставляем HTML из наших же констант, инлайним наши SVG иконки, ведь нам всего лишь нужно покрасить их в цвет текста. Ведь ничего плохого не случится, если мы просто скажем Angular`у — не дрейфь, там всё чисто.
Чаще всего это может быть и так, но в крупных проектах с массой разработчиков, которые пишут независимые компоненты, никогда не знаешь наверняка, где может оказаться твой код. А если вы, как я, разрабатываете библиотеку переиспользуемых компонентов, то подобную ситуацию нужно решить на корню.