Histórico da Página
...
A seguir están cada una de las clases y estructura de un formulario generado a partir del editor.
Clase | Descripción |
---|---|
.form-field | DIV que encuadra todo campo del formulario |
.form-input | DIV principal apenas del campo (no encuadra la label) |
.is-required | Clase del asterisco en campos obligatorios. |
.label-field-properties | Label de los campos |
.paragraph-is-required | Mensaje de obligatorio |
.title-form-application | Clase del título del formulario |
Em alguns casos é necessário utilizar do !important, pois são classes que já são utilizadas pelo fluig e podem ser sobescritas.
HTML
O HTML gerado automaticamente pelo editor de formulários com apenas um campo, fica com a seguinte estruturaEl HTML generado automáticamente por el editor de formularios con apenas un campo, queda con la siguiente estructura:
Bloco de código | ||||||
---|---|---|---|---|---|---|
| ||||||
<form name="formulario"> <h1 class="title-form-application">Formulario Exemplo</h1> <div class="form-field"> <label class="label-field-properties">Campo Nome</label> <span class="is-required"> <b>*</b> </span> <div class="form-input"> <input type="text" name="nome" /> </div> </div> </form> |
...
Ejemplo
A seguir criaremos um crearemos un tema comcon:
- Campos do del tipo input com fundo preto e cor branca con fondo negro y color blanco.
- Labels em negrito e cor bordô. en negrito y color bordó.
- Título del formulario con un margen, color y borde Títutlo do formulário com uma margem, cor e borda inferior.
- Cada bloco bloque de campo terá margem tendrá margen inferior, com espaçamento interno e uma borda vermelha.con espaciamiento interno y un borde rojo.
- Color rojo y tamaño de la fuente para el asterisco de obligatorioCor vermelho e tamanho da fonte para o asterisco de obrigatório.
Para este resultado, o seguinte CSS deve ser criado e cadastrado nos el siguiente CSS se debe crear y registrar en los temas:
Bloco de código language css title exemplo.css linenumbers true input { padding:0 15px !important; background-color:#000; color:#fff; } label { font-weight:bold; color:#8B0000; } .title-form-application { margin:20px; padding: 0 0px 10px; font-size: 1.5em; color: #006699; border-bottom: 1px dashed #ccc; } .form-field { margin-bottom: 15px; border:1px solid red; padding:10px; } .is-required { color:red; font-size:2em; }
Visão Geral
Import HTML Content
Conteúdo das Ferramentas
Tarefas