dr.Brain

doctor Brain

мир глазами веб-разработчика

frontend

CSS: Заглавная буква

Как стилизовать заглавную букву? Используем псевдоэлемент :first-letter

dr.Brain

время чтения 1 мин.

Photo by Cupcake Media on Unsplash

Эту короткую заметку мы посвятим заглавным буквам. А именно, поговорим о редко используемом псевдоэлементе CSS :first-letter. Конечно, стиль начертания заглавных букв будет иметь значение только для больших статей. Но, стоит заметить, это красиво, а так же быстро и легко реализуемо.

Простая адаптивная таблица

Создаем адаптивную таблицу с помощью CSS, не прибегая к сторонним библиотекам.

dr.Brain

время чтения 3 мин.

Photo by Vladimir Proskurovskiy on Unsplash

Адаптивные таблицы - оказывается мы нуждаемся в них гораздо чаще, чем думаем. Обычно, когда есть необходимость создать таблицу для адаптивного сайта, мы делаем собственную разметку или обращаемся к уже существующим сторонним библиотекам. Не нужно этого делать. Полагаю, что обычных HTML таблиц и несложных свойств CSS будет достаточно.

Выравнивание текста по ширине

Свойство CSS text-align знает каждый начинающий разработчик. Поговорим о наименее используемом его значении: justify

dr.Brain

время чтения 1 мин.

Мы знаем, что согласно определению MDN свойство text-align описывается, как выравнивание линейного содержимого, в том числе текста в блоке родительского элемента. В свою очередь, значение свойства justify выстраивает левые и правые границы текста по левым и правым границам содержимого параграфа. Иными словами, происходит одновременное выравнивание текста по левому и правому краю за счет добавления текста между словами.

Почему в CSS серый цвет темнее темно-серого?

Конфликты цветовых схем в CSS на примере оттенков серого цвета

dr.Brain

время чтения 2 мин.

Photo by Vincent Ghilione on Unsplash

Скорее всего, даже имея дело с предопределенными цветами, Вы не обращали внимания на такие мелочи. Тем не менее, в HTML и CSS существуют цвета, которые являются не тем, чем кажутся. Наиболее наглядным примером стала проблема серого (Gray) и темно-серого (Dark Gray) цветов.

Анимация элементов с display:none и callback функции

Учимся делать корректную анимацию появления элемента на странице

dr.Brain

время чтения 3 мин.

Photo by Sam Schooler on Unsplash

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

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.