Знакомая история

Знакомо каждому до боли. Дизайнер дизайн нарисовал красиво - слов нет, только вот формы какие-то странные получились. В зависимости от вашей операционной системы и браузера элементы формы, установленные по умолчанию, могут выглядеть как красиво, так и ужасно расползтись.

Приверженцы программирования в стиле бесполезного кода утверждают, что оформление элементов форм - зло, так что нам приходится мириться со странностями браузеров. Но так не должно быть. Всё можно сделать гораздо лучше…

СКАЧАТЬ | Смотреть пример | Репозиторий GitHub | Блог

Совместимость с: Chrome, Firefox, Opera, Safari, Internet Explorer (6+)

Сравнение

Примеры Google Chrome с Windows / Mac

Код

<head>
<link rel="stylesheet" href="formalize.css" />
<script src="jquery.js"></script>
<script src="jquery.formalize.js"></script>
</head>

Стилизовать форму при помощи CSS довольно просто. Вставьте файл formalize.css, предпочитаемую вами библиотеку JS и файл *.formalize.js в тэг <head>. Вот и всё, проще простого!

Вы так же можете вставить файлы JavaScript перед закрывающим тэгом </body> чтобы ускорить отображение страницы. Для стилизации форм подойдут оба способа.

Библиотеки JS

Logos of JavaScript libraries

Стоит напомнить, что framework CSS немного зависит от JavaScript, поскольку он позволяет старым браузерам поддерживать HTML5. Для совместимости и исключения зависимости от какой-либо определённой библиотеки, "Стилизация при помощи CSS" поддерживает: Dojo, ExtJS, jQuery, MooTools, Prototype и YUI.

Скачав "Стилизацию при помощи CSS" вы получите файлы JS для каждой библиотеки. Просто удалите те их них, которые вам не нужны. Сравните различные их версии. Вы заметите сходства/различия принципов работы библиотек JS.


Отзывы

Можете мне не верить, но экспертам индустрии "Стилизация при помощи CSS" понравилась…

Теперь у нас есть то, за что мы очень благодарны. Нейтан Смит из SonSpring создал библиотеку, которая даёт дизайнерам и разработчикам [контроль].

Джеффри Зелдман

Хороший легковесный комплект CSS, благодаря которому ваши HTML-формы будут выглядеть аккуратными и станут более совместимыми со всеми основными браузерами.

Майк Дэвидсон

Framework от Нейтана Смита для форм, которые должны хорошо выглядеть, быть расширяемыми, совместимыми с HTML5 и работать на большинстве браузеров.

Крис Койер

Формы, совместимые со всеми браузерами. Просто супер!

Аарон Гастефсон

Пример

Примечание: Это всего лишь демонстрация, не отправляющая никаких данных.