CSS3.0 Maker — Получите код CSS для рамки, эффектов теней и многого другого

Ранее мы рассмотрели несколько генераторов кода CSS, таких как Layer Styles и ThemeShock CSS Drop Shadow Generator . Оба превосходны, но ограничены, поскольку они генерируют код только для одного эффекта. CSS3.0 Maker — это автоматический генератор кода CSS, который генерирует код для рамки, тени текста, тени блока, эффектов контура и наклона, масштабирования или пов��рота элемента. Вы можете работать с несколькими файлами CSS (разные стили в каждом файле), создавая разные файлы. Код загружается в виде файла HTML, а CSS добавляется в виде внутреннего листа. Сервис сообщает вам, в какой версии Chrome, Firefox, Internet Explorer, Safari и Opera будут отображаться эффекты и какие мобильные устройства будут их поддерживать.

Чтобы создать несколько файлов, вам потребуется зарегистрировать бесплатную учетную запись. В противном случае сервис можно использовать без его создания. Как ни странно, сайт позволяет вам добавлять больше эффектов, когда вы не вошли в систему. Дополнительные эффекты, которые доступны (когда вы вышли из системы), — это эффекты градиента, анимации и перехода. При использовании в качестве незарегистрированного пользователя сайт не позволяет добавлять несколько эффектов. Если вы решите использовать сервис без регистрации учетной записи, вы увидите горизонтальную полосу прямо под заголовком сайта, которая позволяет вам выбирать различные эффекты.

Если вы хотите добавить несколько эффектов, зарегистрируйте бесплатную учетную запись и создайте файл. Вы можете создать файл, нажав «Новый файл» на главной странице или перейдя в «Мои файлы» . Введите имя для вашего файла. Выберите «Редактировать» , и все внесенные вами изменения будут сохранены в этом файле. Перейдите на вкладку «Главная» , чтобы начать редактирование эффектов.

Для переключения между различными эффектами используйте раскрывающееся меню на вкладке «Главная» . Чтобы изменить цвет элемента и настроить его непрозрачность, перейдите к эффекту RGBA. Чтобы добавить границу или изменить стили границы, перейдите в «Радиус границы». Эффекты Text Shadow и Box Shadow создают эффект тени за элементом или текстом. Вы можете наклонить и масштабировать его с помощью эффекта CSS Transform и сместить границу от элемента с помощью эффекта Outline Offset .

После внесения всех изменений и применения нужных эффектов нажмите «Сохранить» , а затем «Загрузить» , чтобы загрузить файл. Внесите необходимые изменения, и ваш CSS готов к работе. Сервис отлично подходит, если вы хотите поэкспериментировать с дизайном или вам просто нужно поэкспериментировать с множеством CSS-эффектов для конкретного проекта.

Посетите Мастер CSS3.0