Publicado em 19 de jan.

+ de um input, textarea, select, personalizados, customizados

#css #design #desenvolvimento-frontend #bootstrap #input

Pessoal...

Procurei na NET, encontrei para LINK, criar dois tipos de links, mas para INPUT's não encontrei.

	Como posso montar varios tipos estilizados de INPUTS, TEXTAREAS, SELECT???

	Contribuições, agradeço.

input[type=text],
input[type=email] {

 background: white;
 border: 1px solid orangered;
 color: white;
 height: 40px;
 border-radius: 5px;
}

	Tentei usar INPUT.modificado[type=text],

	depois no CLASS do bootstrap HTML, colocar a classe MODIFICADO, mas não ROLA...

	Sugestões?????????

Discussão (2)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

marcelocardoso· 19 de jan.

também tentei assim, olhando algumas coisas na internet, mas nada...

.input-modelo1[type=text],
.input-modelo1[type=email] {

 background: white;
 border: 1px solid orangered;
 /*
 -webkit-box-shadow: 0px 0px 6px 1px rgba(209,207,209,0.75);
 -moz-box-shadow: 0px 0px 6px 1px rgba(209,207,209,0.75);
 box-shadow: 0px 0px 6px 1px rgba(209,207,209,0.75);
 */
 color: white;
 height: 40px;
 border-radius: 5px;
}

.input-modelo1[type=text]:focus,
.input-modelo1[type=email]:focus {

 background-color: rgba(49, 49, 49, 0.20);
 color: rgba(49, 49, 49, 0.35);
}

.input-modelo1::-webkit-input-placeholder {

 color: rgba(49, 49, 49, 0.35) !important;
}

.input-modelo1:-moz-placeholder {

 color: rgba(49, 49, 49, 0.35) !important;
}

.input-modelo1::-moz-placeholder {

 color: rgba(49, 49, 49, 0.35) !important;
}

.input-modelo1:-ms-input-placeholder {

 color: rgba(49, 49, 49, 0.35) !important;
}

	tento inserir na CLASS o class="form-control input-modelo1" mas nem assim estiliza o INPUT.

	tem alguma maneira de realizar isso...

Omar~· 20 de jan.

Tenta assim, mas seu arquivo CSS deve ser requisitado no html depois do arquivo do bootstrap:

Citar

.form-control.input-modelo1 {

/ Propriedades Aqui/

}

Sei quase ou nada de bootstrap, mas posso lhe dizer que apesar de muito bom, ele como vários outros frameworks são por dizer "chupa-cabra" e não lhe permite personalização própria a não ser que edite o próprio framewrok.

Só uma coisa deve pensar antes de usar: Se realmente precisa de algo tudo mastigado, se sim devo limitar ao utilizar somente isso?

Como sugestão procure o arquivo CSS do bootstrap elementos e propriedades relacionadas a input, e veja se algo pode entrar em conflito com as suas, se sim, então você tem 2 opções editar ou remover.