Архив метки: CSS

CSS font-size: единицы измерения

Один из наиболее распространенных вопросов CSS это единицы измерения шрифта. Разработчик может указать их в px, %, em, pt и rem. Давайте рассмотрим их по отдельности.

Рубрика: HTML/CSS | Метки: , | Добавить комментарий

Использование Font Awesome и Bootstrap 3

Казалось бы библиотека шрифтов-иконок Font Awesome была создана для работы с Bootstrap. Но есть пару тонких моментов, которые необходимо учитывать. 

Рубрика: HTML/CSS | Метки: , , , | 2 комментария

Анимация в браузере. Рекомендации

Если анимация для современных браузеров не представляет почти никаких проблем, то для мобильных телефонов она может попортить немало нервов. В любом случае при создании анимации полезно придерживаться нескольких простых правил.

Рубрика: HTML/CSS, JavaScript/JQuery | Метки: , , | 1 комментарий

Правильные CSS селекторы

Довольно часто нахожу в различных проектах небрежное отношение к CSS селекторам. Хотя современные браузеры и позволяют не обращать особого внимания на их написание, все же я рекомендую пользоваться основным правилом. В сложном селекторе самый правый селектор должен быть как можно … Читать далее

Рубрика: HTML/CSS | Метки: | Добавить комментарий

vw, vh и vmin — единицы измерения для CSS3

В CSS3 появились новые единицы измерения, зависящие от размеров окна браузера. 1vw — 1% ширины окна 1vh — 1% высоты окна 1vmin — 1vw или 1vh, в зависимости от того, что меньше На момент написания статьи поддерживается почти всеми современными браузерами. Проверить можно тут.

Рубрика: HTML/CSS | Метки: , , , | Добавить комментарий

Кроссбраузерный CSS-градиент

Очень часто в своих макетах дизайнеры используют всевозможные градиенты. Раньше приходилось вырезать 1-пиксельную картинку с градиентом и размножать ее (repeat). При этом на сервер уходил лишний запрос, что в свою очередь замедляло загрузку страницы. Сегодня  же мы можем создавать градиенты … Читать далее

Рубрика: HTML/CSS | Метки: , | Добавить комментарий

Создаем границы с помощью CSS

Использование CSS для границ не должно ограничиваться стандартными border:1px solid #000; Ниже я приведу более сложные случаи создания границ. Вертикальное и горизонтальное закругление углов Углы также можно закруглять только по горизонтали или по вертикали. Для этого используется 2 значения, разделенные ‘/’: … Читать далее

Рубрика: HTML/CSS | Метки: , , , | Добавить комментарий

Создаем геометрические фигуры с помощью CSS

Довольно часто при верстке сайтов возникает задача вставить в макет какую-либо геометрическую фигуру (треугольник на рисунке ниже). Конечно для этой цели можно просто вырезать картинку типа .gif или .png, но загрузка лишнего файла это не слишком красивый способ. Я рекомендую … Читать далее

Рубрика: HTML/CSS | Метки: | Добавить комментарий

Полезные online сервисы для вебразработчика

В этой статье я хочу перечислить полезные online сервисы для вебразработчиков. 1. RegExr — хороший сервис для создания и отладки регулярных выражений. 2. Spys.ru — обновляющиеся списки прокси-серверов по всему миру. Очень удобно использовать в паре с расширением для Google Chrome — Proxy SwitchySharp. … Читать далее

Рубрика: Internet | Метки: , , , | 1 комментарий

Как убрать лишние отступы для кнопок в Mozilla Firefox

Иногда  при верстке кнопок можно столкнуться с проблемой в браузере Firefox, если нам надо полностью убрать отступы в кнопке. Для остальных (новых) браузеров достаточно написать следующий CSS: [codesyntax lang=»css» title=»CSS»] .button{ padding:0; border:0; } [/codesyntax] Но Firefox упрямо оставляет между текстом и … Читать далее

Рубрика: HTML/CSS | Метки: , , | 4 комментария
  • Страница 1 из 2
  • 1
  • 2
  • >