Для того, чтобы email рассылка смотрелась максимально одинаково в большинстве почтовых клиентах, необходимо придерживаться некоторых базовыx правил HTML верстки email-писем.
Несколько примеров почтовых клиентов:
веб-версии у почтовых провайдеров (Gmail, Yandex, Mail, Yahoo и т.д.)
десктопные почтовые клиенты (Outlook, Bat, Thunderbird, Mac Mail)
мобильные почтовые клиенты (Blackberry, Android, Iphone, Ipad и т.д.)
К сожалению, не существует обязательного стандарта верстки писем, который бы универсально поддерживался бы всеми клиентами. Часть поддерживает CSS3, часть нет, какие-то теги и аттрибуты поддерживаются, какие-то нет, не говоря уже о том, что поддержка HTML и CSS меняется даже в пределах одного почтового клиента от версии к версии. Последнее особенно заметно на примере Outlook (от Express и 2003 к Outlook 2011). Читать дальше...
В CSS3 имеются параметры (свойства), посредством которых можно трансформировать (поворачивать, масштабировать и т.д.) элементы страницы, а также анимировать (плавно изменять во времени) их свойства. При этом можно обойтись без сценариев на JavaScript и SVG. В браузерах (Opera 18 и Chrome 31) в именах CSS-свойств пока требуется указывать специальные (вендорные) префиксы -o- и -webkit- соответственно (например, -o-transform и -webkit-transform).
CSS-трансформация
Трансформации в CSS3 задаются посредством свойства transform. Выберите в списках вид трансформации (значение свойства transform) и ее центр (значение свойства transform-origin) и посмотрите результат ее применения к элементу <div>, содержащему текст и картинку. Под списками отображаются CSS-свойства (без вендорных префиксов), соответствующее выбранной трансформации. Каждая трансформация здесь применяется к исходному элементу, а не к результату предыдущей трансформации. Читать дальше...
Вот уже на протяжении четырёх лет, с сентября 2011 г. W3C занимается разработкой CSS4. Модули четвёртой версии каскадных таблиц стилей проектируются на базе CSS3 и дополняют их новыми свойствами и значениями. В этой статье я хотел бы рассказать о том, как использовать возможности CSS4 уже сегодня, о cssnext.
Итак, cssnext — это CSS компилятор, позволяющий использовать последний синтаксис CSS уже сегодня. Он преобразует новые CSS спецификации в более современный код так, что вам не придётся ждать поддержки новых возможностей в вашем браузере. Читать дальше...
Эффект Glitch Лукаса Беббера выглядит очень круто — как будто вы смотрите на текст на старом мониторе, который слишком часто роняли на пол и у него «плавает» вертикальная синхронизация и сведение.
Реализация этого эффекта на CSS выглядит вполне убедительно. Мне пришлось немного поломать голову, чтобы выяснить, как он работает, и теперь я хочу объяснить это вам. Кроме того, я воспроизвёл этот эффект не только для текста, но и для растровых изображений и SVG, а так же написал несколько примесей Sass, чтобы облегчить работу с ним. Читать дальше...
Заходим на любой сайт в интернете (к другу — пошутить, к врагу — напакостить), и в адресной строке вашего браузера пишем следующую строчку, и нажимаем ENTER:
Часто тексты со страниц попросту воруют и публикуют на своем сайте, причем это даже не госзаказ, и они не проставляют ссылки на источник.
Можно отключать выделение текста для любого блока, например, для определенного div'а. Если поставить данный код для тега body, будет запрещено выделение всей страницы
В блок, в котором мы хотим запретить выделение текста необходимо добавить обработчик для javascript (используется для браузеров Internet Explorer)
onselectstart="return false"
и css-стили (используется для браузеров FireFox (на движке gecko), Safari (на движке KHTML))
Для Браузера Opera необходимо писать дополнительную функцию preventSelection(); (листинг функции ниже)
Функция запрещает выделение во всем документе, кроме элементов input и textarea
Вызвать данную функцию
preventSelection(document);
Однако текст можно с легкостью скопировать, всего лишь заглянув в исходный html-код страницы
Такой способ может помочь в защите текстов от людей, но никак не поможет от роботов (программ, которые скачивают страницы целиком)
Клепал тут меню для сайта на CSS. но т.к. в нем применяется псевдо-класс :hover, то нарисовалась маленькая проблема. дело в том, что в IE6 и ниже :hover поддерживается только для ссылок, но совершенно не работают с любыми другими элементами. А мне для меню необходимо было, чтоб :hover работал с рисунками.
Для себя я решил это нижеприведенным способом, может, кому пригодится также.
Существует так называемый whatever:hover способ, который дает возможность применять селектор :hover в IE6 и ниже. последняя версия 1.00.031224. примеры работы можно посмотреть там же, по ссылке выше. Читать дальше...