DevGang
Авторизоваться

Overflow в CSS

В CSS мы можем контролировать элемент, когда его содержимое слишком велико, чтобы уместиться. Свойство для этого- overflow , которое является сокращением для свойств overflow-x и overflow-y .

В этой статье я познакомлю вас с этими свойствами, а затем мы вместе рассмотрим некоторые концепции и варианты использования, связанные с переполнением.  

Все об auto в CSS

В CSS у нас есть значение auto , которое можно использовать для таких свойств, как поля, расположение, высота, ширина и многое другое. Я чувствовал, что мне нужно место, чтобы документировать все, что я о них знаю, чтобы он мог быть ориентиром для всех, кто заинтересован в этом auto .

CSS-полоса прокрутки с индикатором прогресса 

Полосы прокрутки являются естественными индикаторами прогресса. Насколько полоса прокручена вниз или в сторону - это прогресс, достигнутый при прокрутке этого элемента (часто всей страницы). Но они больше похожи на индикаторы прогресса, чем на метры, если вы думаете о метре как о чем-то, что «заполняется» на ходу.

Использование CSS для установки текста внутри круга 

Вы хотите установить текст внутри формы круга с помощью HTML и CSS? Это безумный разговор, верно?

На самом деле, нет! Благодаря shape-outside и некоторым хитростям CSS можно сделать именно это. 

CSS выводы из нового дизайна Facebook

Я любопытный человек, который всегда заинтересован в открытии браузера DevTools, чтобы увидеть, как все было сделано на веб-сайте. Это первый раз, когда я веду блог о чем-то подобном. Я нашел несколько интересных применений различных функций CSS (по крайней мере, для меня), и я хотел бы поделиться ими с вами.

Руководство для начинающих по Sass

В последние годы CSS превратился из написания простых наборов правил в мощный движок для создания прекрасного пользовательского опыта. Но по мере того, как проекты усложняются, как и CSS, который пишется, становится все труднее управлять и еще сложнее вносить изменения. В нативном CSS реализованы некоторые новые инструменты, такие как Grid и переменные, но препроцессоры CSS поднимают написание и управление CSS на следующий уровень.

Как использовать значение currentColor в CSS 

В CSS у нас есть специальное значение цвета currentColor, которое может быть неизвестно большинству людей.

Размещение текста по пути с помощью CSS и Motion Path

За последние пару месяцев я много играл с CSS Motion Path и получал массу удовольствия от создания демонстраций, некоторые из которых вы можете найти в этой коллекции Codepen. Но название «Motion Path» немного вводит в заблуждение, поскольку оно относится не только к движению. Фактически, хотя спецификация по-прежнему называется «Motion Path», свойство, используемое для определения пути, было изменено с motion-path на offset-path. Легко понять, почему: элемент может быть размещен в любом месте пути, с движением или без движения - его положение (или значение offset-distance) не нужно анимировать.

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

Я уверен, что нет! Томек Сулковси показывает, как мы можем изменить нумерацию упорядоченных списков с помощью простого атрибута HTML:

Указание позиции прокрутки на странице с помощью CSS 

Основанные на прокрутке функции, как правило, включают в себя некоторую смесь CSS и JavaScript. Это потому, что для этого просто не так много встроенных функций. Но что, если бы мы могли сделать что-то, что использует только CSS? 

Каскадные таблицы стилей (CSS) - это язык таблиц стилей, используемый для описания представления документа, написанного на языке разметки. Хотя чаще всего используется для установки визуального стиля веб-страниц и пользовательских интерфейсов, написанных в HTML и XHTML, язык может быть применен к любому XML-документу, включая простой XML, SVG и XUL. Наряду с HTML и JavaScript, CSS - это важная технология, используемая большинством веб-сайтов для создания визуально привлекательных веб-страниц, пользовательских интерфейсов для веб-приложений и пользовательских интерфейсов для многих мобильных приложений.

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

Присоединяйся в тусовку

Поделитесь своим опытом, расскажите о новом инструменте, библиотеке или фреймворке. Для этого не обязательно становится постоянным автором.

Попробовать

В подарок 100$ на счет при регистрации

Получить