Здравствуй, дорогой читатель хабра!
Сегодня мы поговорим о градиентных границах, режимах наложения, о том, как рациональнее сверстать стандартную иконку меню. А так же откроем для себя заново старое css-свойство visibility и рассмотрим новое медиа-выражение @Supports.
Читать полностью »
На Хабрахабре уже не раз поднимался вопрос о том, что популярные на сегодняшний день жизненные циклы разработки веб-интерфейсов, прямо говоря, устарели. Последний раз его обсуждали в публикации «Дизайн в браузере», но так и не пришли к единому мнению.
Настало время наконец-то найти ответы на два главных вопроса: “Кто виноват?” и “Что делать?” в вечной борьбе дизайна и верстки…
Доброго всем дня!
На хабре уже немало статей о том, как и где применяется вёрстка в LaTeX. От стандартных научных статей и презентаций до календарей и резюме.
Основным достоинством LaTeX изначально являлось освобождение пишущего от необходимости думать о расположении текста на страничке: автор пишет контент, а движок размещает всё в нужных местах.
Отсюда непреодолимое желание начать сверлить пилой и пилить буравчиком решить при помощи LaTeX задачу, требующую полного контроля расположения текста на странице. Классический пример — вёрстка визиток, которой мы и займёмся.
Читать полностью »
Очень часто стоит задача выровнять блок по центру страницы / экрана, да ещё и так, чтобы без ява-скрипта, без задания жёстких размеров или отрицательных отступов, ещё чтобы и скроллбары работали у родителя, если блок превышает его размеры. В сети ходят достаточно много однообразных примеров как выровнять блок по центру экрана. Как правило большинство из них основаны на одних принципах.
Читать полностью »
День добрый!
Наконец добрался до своей учетки на хабре, а то обленился так, что все читаю с братского компа )
Хочу поделиться небольшим сервисом — генератором обводки текста.
Пока стандарты утрясаются, можно с помощью небольшого хака с text-shadow добиться того же эффекта.
Нужно было тот для проекта подобрать для разных надписей разные обводки визуально.
К своему удивлению обнаружил отсутствие такого генератора в просторах интернета, однако, быть может, плохо искал (прошу подсказать в комментах, если знаете).
Решил написать сам.
Генератор живет здесь.
Можно менять цвет/прозрачность фона и тени, а так же добавлять фоновое изображение.
Читать полностью »
Привет, читатель хабра.
Ты наверное сразу спросишь меня: «Да кто ты такой, чтобы давать мне советы?». Итак, немного обо мне.
Первое мое общение с HTML и CSS было 10 лет назад, еще в школе, когда у меня только появился интернет, и я понял что тоже хочу делать странички, которые сможет увидеть весь мир. С тех пор у меня есть как минимум 5 полных лет опыта разработки сайтов по-взрослому. Сейчас я могу без лишней скромности сказать, что сверстал я уже пару сотен сайтов, большинство из которых, как ни странно, совершенно не совпадают с моими текущими требованиями к верстке.
Я не хочу рассказывать как надо делать, эта статья результат моего опыта и попытка написать рекомендации тем, кто только начинает, хотя и для матерых верстальщиков (слово режущие слух) здесь могут найтись интересные идеи.
Если ты заинтересовался прошу под кат…
Читать полностью »
Всем доброго времени суток. Сегодня мы поговорим о том, как красиво оформить выделенный текст, совладать с отступами в кнопках, прокачать скролл в мобильных браузерах, скрестить цвет текста с цветом границ, а также рассмотрим интересные новые единицы измерения.
Читать полностью »
Доброго времени суток!
Так уж завелось, что подавляющее большинство веб-дизайнеров создают макеты сайтов в Adobe Photoshop. И каждый раз, мы, бедные верстальщики, испытываем на себе все минусы и проблемы PS. И нам всегда приходилось с ними мириться, либо использовать всяческие плагины костыли, и сторонние приложения костыли. Даже новомодный и перспективный Sketch создан, в первую очередь, для создания макетов, а не для извлечения информации для верстки.
Но темные времена прошли, и тучи начинают рассеиваться над миром фронтенд-разработчиков. Итак, встречайте: Avocode!Читать полностью »
Надеюсь этот пост послужит ликбезом всем веб-дизайнерам, верстальщикам, и проджект-менеджерам. Если вы хороший верстальщик, вас однозначно раздражают растровые изображения. Вы ненавидите растр, и всё, что имеет заметные глазу пиксели. Если это не так, добро пожаловать под кат.
Читать полностью »
Перевод статьи «Use Elements as Background Images with -moz-element», David Walsh
Все мы знаем, что все браузерные вендоры по своему определяют многие CSS и JavaScript фичи, и я благодарен им за это. Mozilla и WebKit предлагают свои интересные проприетарные свойства, и хотя, как мы знаем, утверждение стандартов происходит годами, намного дольше чем стоило бы, мы все должны быть за это благодарны. Есть одно интересное CSS свойство о котором вы наверняка еще не слышали — -moz-element, это реализованное Mozill'ой CSS свойство, которое позволяет разработчикам использовать HTML элементы в качестве фонов для других элементов!
