dr.Brain

doctor Brain

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

css

CSS: кнопка в форме таблетки

делаем кнопку с закругленными краями с помощью CSS

dr.Brain

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

Photo by Myriam Zilles on Unsplash

Сделать кнопку в форме таблетки или пилюли (кнопку со скругленными краями) можно, установив элементу button очень большое значение для свойства border-radius, которое, несомненно, должно быть больше высоты кнопки.

CSS: Bootstrap vs. Tailwind CSS

ищем различия между Bootstrap и Tailwind CSS

dr.Brain

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

Photo by Justin Porter on Unsplash

Сегодня мы погрузимся в мир CSS-фреймворков и сравним Bootstrap и Tailwind CSS . Независимо от того, являетесь ли вы опытным разработчиком или только начинаете изучение HTML-верстки, выбор правильного фреймворка существенно влияет на организацию рабочего процесса и визаульное представление готовых проектов.

CSS: откажись от margin-top

формируем отступы с помощью margin-bottom и gap

dr.Brain

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

Photo by Tim Wildsmith on Unsplash

Вот и настало время для переосмысления подхода к верстке макетов. Давайте поговорим о CSS-свойстве margin-top. Уже много лет margin-top - один из основных элементов в наборе инструментов верстальщика. Но важно знать, что есть и более интересные способы управления пространством между блоками, позволяющие создавать понятный и удобный для дальнейшей работы код: margin-bottom и gap.

CSS: вращение

вращение изображения при наведении с помощью CSS

dr.Brain

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

Photo by Jacek Dylag on Unsplash

Вращение (hover-rotate) картинки при наведении добавляет веб-странице интерактивности и делает её более привлекательной для пользователей. Рассмотрим, как с помощью HTML и CSS реализовать поворот изображения по оси.

CSS: фиксируем количество строк

ограничиваем количество строк с помощью CSS

dr.Brain

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

Photo by René Lehmkuhl on Unsplash

Порой, для улучшения читабельности контента на странце необходимо ограничить количество выводимых в блоке строк.

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

Далее

Категории

О нас

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