Customize seu Formulário Usando Códigos CSS Personalizados

ATUALIZAÇÃO: Vamos criar formulários fantásticos com este curso em vídeo para Form Designer, que te permite criar lindos designs de formulário sem precisar ter conhecimento de CSS!

Primeiro, você precisa aprender a inserir códigos CSS personalizados no seu formulário antes de começar a customizar seu formulário usando os códigos CSS fornecidos abaixo.

Definir uma imagem de fundo para a página

.supernova {
background-image:url('http://www.site.com/image.jpg');
background-repeat: no-repeat;
background-position: center top;
background-attachment: fixed;
background-size: cover;}

Substitua a URL pela sua imagem de fundo

Demo aqui

Tornar sua página de fundo transparente

.supernova {
background:transparent;
}

Remover o espaçamento em volta do formulário

.jotform-form {
padding:0;
}

Tornar o fundo do formulário transparente

.form-all {
background:transparent;
}

Mudar a cor de fundo do header

[data-type="control_head"]{background-color:#FFCC66;}

Mudar a cor do texto do subtítulo

.form-subHeader {color:#2408FC !important;}

Mudar a cor dos sub-labels

.form-sub-label {color:#FFCC66;}

Mudar a cor do destaque

.form-line-active {background:#baffb9;}

Mudar a cor da estrela de dado obrigatório

.form-required {color: blue !important;}

Remover o fundo vermelho das mensagens de erro

 .form-line-error {background:transparent;}

Alinhar o formulário à esquerda

.form-all {margin:0;}

Preview Aqui

Criar instantaneamente layout de duas colunas para os campos

.form-line-column {width: 50%;}.form-line-column:nth-child(even) {clear: left;}

Demo aqui

Tornar os campos de cartão de crédito sensíveis à integração com pagamentos por celular

Copiar os códigos CSS aqui: http://pastebin.com/raw/UJV3nGf5

Demo aqui

Se você não consegue encontrar o código CSS que você precisa no seu formulário ou precisa de ajuda para personalizar seu formulário, fique à vontade para comentar abaixo: