Главная > CSS/Style Sheets > 10 фрагментов CSS3-кода для разработчиков
10 фрагментов CSS3-кода для разработчиков27 ноября 2013, 15:45. Разместил: Design FactoRy |
Одним из наиболее важных для веб-разработчиков языков считается CSS3. Новичок вы или опытный разработчиков веб-сайтов, заранее подготовленные фрагменты CSS3-кода могут пригодиться вам. В то время как HTML предлагает нам структуру документов, эта структура порой может по-разному отображаться в разных браузерах. При оформлении ваших веб-сайтов, CSS3 может помочь вам создавать более интересные стили. Сегодня мы хотим предложить вам подборку из 10 фрагментов CSS3-кода для разработчиков, которые можно использовать в собственных проектах вне зависимости от того, новичок вы или продвинутый разработчик. Размытый текст Данный фрагмент CSS-кода позволяет вам сделать текст немного прозрачным, а также добавить тень:
Предварительная загрузка изображения Иногда бывает гораздо удобнее предварительно подгрузить все нужные изображения для конкретного элемента. Этот невероятный отрывок кода позволит вам заранее подготовить все изображения, а затем отобразить их разом.
Текст с градиентом Сегодня вы можете добиться текста с эффектом градиента при помощи webkit. Это самый опрятный способ добиться красивого текста, который при этом будет возможно редактировать, и нет необходимости использовать Photoshop.
Прозрачность изображений IE9, Firefox, Chrome, Opera и Safari используют свойство opacity для прозрачности. Свойство opacity принимает значения от 0.0 до 1.0. Самое низкое значение приводит к прозрачности элемента. IE8 и более ранние версии используют filter:alpha(opacity=x). X способен принимать значения от 0 до 100. Чем ниже значение, тем более прозрачным будет элемент.
Несколько фонов CSS3 позволяет веб-дизайнерам указывать несколько изображений для фона элементов, и для этого понадобится не что иное, как простой список через запятую.
Тень текста Теперь вам не обязательно использовать Photoshop, если вам хочется создать тень. Этот небольшой CSS3-сниппет поможет вам в этом:
Псевдо-классы ссылок Ссылки можно отображать различными методами в браузерах, которые поддерживают CSS:
Закругленные углы Благодаря CSS3, вы можете добавлять закругленные углы.
Использование @font-face Font-face – это отличный способ использовать небезопасные для веб-браузеров шрифты в ваших проектах. Пока метод с использованием @font-face работает, вам также следует обратить внимание на Fonts Squirel.
Удаляем скроллинг в текстовых полях в IE Internet Explorer зачастую надоедает тем, что в каждом текстовом поле принудительно отображается скроллинг, даже если он перекрывает контент. Вы можете избежать этого, воспользовавшись этим небольшим CSS-сниппетом.
Вернуться назад |