АКТУАЛИЗАЦИЯ: Нека създадем фантастични форми с видео курса за “Дизайнера на форми“, който ви позволява да генерирате красиви дизайни на форми, без да знаете CSS!
Първо, трябва да научите как да инжектирате персонализиран CSS във вашата форма, преди да започнете да персонализирате формата си, използвайки CSS кодовете, които са предоставени по-долу.
Задайте фоново изображение на страницата
.supernova {
background-image:url(‘http://www.site.com/image.jpg’);
background-repeat: no-repeat;
background-position: center top;
background-attachment: fixed;
background-size: cover;}
Заменете URL адреса с вашето фоново изображение.
Демо тук
Направете фона на страницата прозрачен
.supernova {
background:transparent;
}
Премахнете интервала около формата
.jotform-form {
padding:0;
}
Направете прозрачен фона на формата
.form-all {
background:transparent;
}
Променете цвета на фона на заглавието
[data-type=”control_head”]{background-color:#FFCC66;}
Променете цвета на текста на подзаглавието
.form-subHeader {color:#2408FC !important;}
Променете целия цвят на подзаглавието
.form-sub-label {color:#FFCC66;}
Променете цвета на ефекта на жълтото маркиране
.form-line-active {background:#baffb9;}
Променете цвета на звездата, който за изискване
.form-required {color: blue !important;}
Премахнете червения фон на съобщенията за грешки
.form-line-error {background:transparent;}
Подравнете формата вляво
.form-all {margin:0;}
Визуализация тук
Незабавно създайте оформление с две колони върху свити полета
.form-line-column {width: 50%;}.form-line-column:nth-child(even) {clear: left;}
Демо тук
Направете полетата за кредитни карти във всички платежни интеграции мобилно адаптивни
Копирайте CSS кодовете тук: http://pastebin.com/raw/UJV3nGf5
Демо тук
Ако не можете да намерите CSS кода, който ви е необходим за вашата форма или ако се нуждаете от помощ за персонализиране на формата, не се колебайте да оставите коментари по-долу.
Изпратете коментар: