Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
» Pivot Cinco
Hoje à(s) 10:03 pm por Dr.

» Transferir código para ModerNBB
Hoje à(s) 10:02 pm por Luiz

» Cyber-Designer
Hoje à(s) 10:02 pm por Dr.

» Neve para ModerNBB
Hoje à(s) 09:35 pm por Luiz

» Formulário de Resposta
Hoje à(s) 09:13 pm por iScroll

» Colocar efeito Glitter no nick aparencendo na categoria do forum
Hoje à(s) 09:07 pm por Luiz

» Ajustar Largura
Hoje à(s) 08:50 pm por Luiz

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
Luiz
 
iScroll
 
Gaaratsu
 
Daniel Yan
 
Ketholy
 
Shek
 
Eduardo Lima
 
ranzatti
 
cocas20
 
LucasPofahl
 

Quem está conectado
245 usuários online :: 13 usuários cadastrados, 1 Invisível e 231 Visitantes :: 2 Motores de busca

BlueJOkeR, Daniel Yan, Dr., EDU2010, EduardoMGP, Gaaratsu, iScroll, IsmaelS., Ketholy, Luiz, odelgado, ranzatti, WizzardPT

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Personalizar formulário

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Personalizar formulário

Mensagem por Luiz em 28/07/16, 07:00 pm

Detalhes da questão


Endereço do fórum: jornalrhc.forumeiros.com
Versão do fórum: PhpBB3

Descrição


Olá, gostaria de ajuda para personalizar os formulários gerados pelo gerador do FdF.

Exemplo de como queria:


Gostaria que as bordas ficassem dessa forma.
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 28/07/16, 09:01 pm

Vale lembrar que no meu fórum, existem vários formulários.
Gostaria de editar poucas coisas em cada, pra que fique mais fácil.
Tipo só ter que adicionar um CSS em todos. e.e
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 28/07/16, 10:02 pm

Olá, é proibido mensagens consecutivas.

Bom, poderia me informar o código html de sua pagina? Deseja igual a imagem?

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 28/07/16, 10:16 pm

Olá, tenho várias como:

Código:
<br />             <script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
               <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
            <script src="http://ajuda.forumeiros.com/29110.js"></script>
                <script src="http://ajuda.forumeiros.com/28074.js"></script>
                <style>
            #generated_form .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#generated_form .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
#generated_form .image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
#generated_form .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
#generated_form .image { width: 300px; }
 
#generated_form h1 {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 2em;
font-weight: 400;
margin: .8em 0 .2em;
}
 
#generated_form dl {
   margin-bottom: 10px;
   font-size: 1.1em;
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}
 
#generated_form dt {
   width: 30%;
   padding-top: 5px;
   border: none;
   float: left;
}
 
#generated_form dd {
   padding: 5px;
   padding-right: 5px;
   margin-left: 30%;
   vertical-align: middle;
}
#generated_form dl:hover dt {
   color: #666;
}
 
#generated_form input {
   font-family: "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
   font-weight: normal;
   color: #333333;
   padding: 2px;
   vertical-align: middle;
   padding-left: 4px;
}
 
#generated_form input[disabled] {
   background-color:#ddd;
   cursor:pointer;
}
 
#generated_form select {
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
   font-weight: normal;
   font-style: normal;
   cursor: default;
   vertical-align: middle;
   width:auto;
   max-width:100%;/* Bug IE */
   padding: 1px;
}
 
#generated_form textarea {
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
   width: 300px;
   height: 100px;
   padding: 2px;
   padding-left: 4px;
   cursor: text;
}
 
#generated_form input[type=text], #generated_form input[type=fields_list] {
   width: 300px;
   cursor: text;
}
</style>
          


 <form onsubmit="submit_form();" action="/post" id="generated_form" method="post" enctype="multipart/form-data">

 <input type="hidden" name="form_mode" value="1">

<h1 data-type="field">Relatório de Aulas</h1>

<p data-type="field">Preencha os campos abaixo com o que for pedido. Os campos marcados como "Opcional", não precisam ser preenchidos obrigatoriamente.</p>

<dl><dt>Nick dos recrutas:</dt>
                            <dd><input type="text" data-type="field" value="" id="field0"></dd>
                        </dl>

<dl><dt>Número total de recrutas:</dt>
                            <dd><input type="number" min="0" max="10" data-type="field" value="" step="1" id="field1"></dd>
                        </dl>

<dl><dt>Número de recrutas aprovados:</dt>
                            <dd><input type="number" min="0" max="10" data-type="field" value="" step="1" id="field2"></dd>
                        </dl>

<dl><dt>Nick do Guia:</dt>
                            <dd><input type="text" data-type="field" value="" id="field3"></dd>
                        </dl>

<dl>
                            <dt>Observação (Opcional):</dt>
                            <dd><textarea data-type="field" id="field4"></textarea></dd>
                        </dl>

<dl><dt>Atenciosamente,</dt>
                            <dd><input type="text" data-type="field" value="" id="field5"></dd>
                        </dl>


         <textarea id="message-template-bbcode-1" style="display:none">[h3]Relatório de Aulas [/h3]

[b] Nick dos recrutas: [/b]   {field0}

[b] Número total de recrutas:[/b]   {field1}

[b] Número de recrutas aprovados:[/b]   {field2}

[b] Nick do Guia:[/b]   {field3}

[b] Observação (Opcional):[/b]   {field4}


Atenciosamente,   {field5}
</textarea>
            <input type="hidden" name="attach_sig" value="">
            <input type="hidden" name="mode" value="reply">
            <input type="hidden" name="t" value="51">
            <input type="hidden" name="lt" value="146">
            <input type="hidden" name="notify" value="1">
            <input type="submit" name="post" class="button2" value="Enviar">
         
                <textarea name="message" style="display:none"></textarea>
           

</form>


Mas nada muito diferente.
Se precisar de todos, avise.

Sim, desejo algo parecido com o da imagem.
Me desculpe, não sabia que era proibido mensagens consecutivas! Triste
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 28/07/16, 10:29 pm

Bom, se sua dúvida se trata sobre a aparência das input ser assim ,e do enviar assim, então deixaria aqui o código e você poe em todas as paginas html ... mais simples e pratico !

ponha isto nas suas paginas html:
Código:
<style>#generated_form input , #generated_form textarea {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:50%!important;
}
</style>

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar formulário

Mensagem por REVIEW em 28/07/16, 10:41 pm

Olá meu caro,
personalizei o código HTML de acordo com a imagem fornecida, veja se está como pretende:
Código:
<br />            <script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
              <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
            <script src="http://ajuda.forumeiros.com/29110.js"></script>
                <script src="http://ajuda.forumeiros.com/28074.js"></script>
                <style>
            #generated_form .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#generated_form .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
#generated_form .image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
#generated_form .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
#generated_form .image { width: 300px; }
 
#generated_form h1 {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 2em;
font-weight: 400;
margin: .8em 0 .2em;
}
 
#generated_form dl {
  margin-bottom: 10px;
  font-size: 1.1em;
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}
 
#generated_form dt {
  width: 30%;
  padding-top: 5px;
  border: none;
  float: left;
}
 
#generated_form dd {
  padding: 5px;
  padding-right: 5px;
  margin-left: 30%;
  vertical-align: middle;
}
#generated_form dl:hover dt {
  color: #666;
}
 
#generated_form input {
  font-family: "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
  font-weight: normal;
  color: #333333;
  padding: 2px;
  vertical-align: middle;
  padding-left: 4px;
  position: relative;
  margin-left: -294px;
    top: 13px;
    height: 27px;
    width: 180px;
    border-radius: 5px;
    border: 1px solid #e3e3e3;
}
 
#generated_form input[disabled] {
  background-color:#ddd;
  cursor:pointer;
}
 
#generated_form select {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  cursor: default;
  vertical-align: middle;
  width:auto;
  max-width:100%;/* Bug IE */
  padding: 1px;
}
 
#generated_form textarea {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  width: 300px;
  height: 100px;
  padding: 2px;
  padding-left: 4px;
  cursor: text;
  margin-left: -294px;
  position: relative;
    top: 15px;
    height: 80px;
    width: 500px;
    border-radius: 5px;
    border: 1px solid #e3e3e3;
}
 
#generated_form input[type=text], #generated_form input[type=fields_list] {
  width: 600px;
  cursor: text;
  margin-left: -296px;
  position: relative;
  top: 15px;
  border-radius: 9px;
  height: 32px;
  border:1px solid #e3e3e3;
}
</style>
         
 
 
 <form onsubmit="submit_form();" action="/post" id="generated_form" method="post" enctype="multipart/form-data">
 
 <input type="hidden" name="form_mode" value="1">
 
<h1 data-type="field">Relatório de Aulas</h1>
 
<p data-type="field">Preencha os campos abaixo com o que for pedido. Os campos marcados como "Opcional", não precisam ser preenchidos obrigatoriamente.</p>
 
<dl><dt>Nick dos recrutas:</dt>
                            <dd><input type="text" data-type="field" value="" id="field0"></dd>
                        </dl>
 
<dl><dt>Número total de recrutas:</dt>
                            <dd><input type="number" min="0" max="10" data-type="field" value="" step="1" id="field1"></dd>
                        </dl>
 
<dl><dt>Número de recrutas aprovados:</dt>
                            <dd><input type="number" min="0" max="10" data-type="field" value="" step="1" id="field2"></dd>
                        </dl>
 
<dl><dt>Nick do Guia:</dt>
                            <dd><input type="text" data-type="field" value="" id="field3"></dd>
                        </dl>
 
<dl>
                            <dt>Observação (Opcional):</dt>
                            <dd><textarea data-type="field" id="field4"></textarea></dd>
                        </dl>
 
<dl><dt>Atenciosamente,</dt>
                            <dd><input type="text" data-type="field" value="" id="field5"></dd>
                        </dl>
 
 
        <textarea id="message-template-bbcode-1" style="display:none">[h3]Relatório de Aulas [/h3]
 
[b] Nick dos recrutas: [/b]  {field0}
 
[b] Número total de recrutas:[/b]  {field1}
 
[b] Número de recrutas aprovados:[/b]  {field2}
 
[b] Nick do Guia:[/b]  {field3}
 
[b] Observação (Opcional):[/b]  {field4}
 
 
Atenciosamente,  {field5}
</textarea>
            <input type="hidden" name="attach_sig" value="">
            <input type="hidden" name="mode" value="reply">
            <input type="hidden" name="t" value="51">
            <input type="hidden" name="lt" value="146">
            <input type="hidden" name="notify" value="1">
            <input type="submit" name="post" class="button2" value="Enviar">
       
                <textarea name="message" style="display:none"></textarea>
           
 
</form>

Atenciosamente,
Luig.
avatar

REVIEW
Membro do Fórum

Masculino
Inscrito dia : 30/12/2014
Mensagens : 1189
Pontos Ativos : 2284

Ver perfil do usuário http://ceudasart.forumeiros.com/

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 28/07/16, 10:58 pm

@while escreveu:Bom, se sua dúvida se trata sobre a aparência das input ser assim ,e do enviar assim, então deixaria aqui o código e você poe em todas as paginas html ... mais simples e pratico !

ponha isto nas suas paginas html:
Código:
<style>#generated_form input , #generated_form textarea {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:50%!important;
}
</style>

Até mais.

While tem como deixar assim?



O seu tá assim:



Além disso tem como dar uma arredondada nas bordas?
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 28/07/16, 11:08 pm

Olá, claro!

Troque o código que forneci acima por este:

Código:
<style>#generated_form input , #generated_form textarea {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
  margin-left:35%;
 border-radius:5px;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:23%!important;
margin-left:54%;
}
</style>

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 29/07/16, 09:28 am

Ficou assim:
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 29/07/16, 10:19 am

Estranho... por acaso você trocou pelo formulário do luig?
Peço que deixe o seu! foi nele que fiz o teste e funcionou numa beleza, veja o resultado que devia ter dado: http://prntscr.com/bz29kl

Enfim, troque esse fórmula rio que me passaste por este:

Código:
<br />            <script src="http://jscolor.com/jscolor/jscolor.js" type="text/javascript"></script>              <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>            <script src="http://ajuda.forumeiros.com/29110.js"></script>                <script src="http://ajuda.forumeiros.com/28074.js"></script>                <style>
            #generated_form .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#generated_form .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
#generated_form .image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
#generated_form .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
#generated_form .image { width: 300px; }
 
#generated_form h1 {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 2em;
font-weight: 400;
margin: .8em 0 .2em;
}
 
#generated_form dl {
  margin-bottom: 10px;
  font-size: 1.1em;
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}
 
#generated_form dt {
  width: 30%;
  padding-top: 5px;
  border: none;
  float: left;
}
 
#generated_form dd {
  padding: 5px;
  padding-right: 5px;
  margin-left: 30%;
  vertical-align: middle;
}
#generated_form dl:hover dt {
  color: #666;
}
 
#generated_form input {
  font-family: "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
  font-weight: normal;
  color: #333333;
  padding: 2px;
  vertical-align: middle;
  padding-left: 4px;
}
 
#generated_form input[disabled] {
  background-color:#ddd;
  cursor:pointer;
}
 
#generated_form select {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  cursor: default;
  vertical-align: middle;
  width:auto;
  max-width:100%;/* Bug IE */
  padding: 1px;
}
 
#generated_form textarea {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  width: 300px;
  height: 100px;
  padding: 2px;
  padding-left: 4px;
  cursor: text;
}
 
#generated_form input[type=text], #generated_form input[type=fields_list] {
  width: 300px;
  cursor: text;
}
</style>               
<form enctype="multipart/form-data" method="post" id="generated_form" action="/post" onsubmit="submit_form();">
       <input value="1" name="form_mode" type="hidden" /> 
   <h1 data-type="field">
      Relatorio de Aulas
   </h1>
    
   <p data-type="field">
      Preencha os campos abaixo com o que for pedido. Os campos marcados como "Opcional", nao precisam ser preenchidos obrigatoriamente.
   </p>
     <dl><dt>Nick dos recrutas:</dt>                            <dd><input id="field0" value="" data-type="field" type="text" /></dd>                        </dl>  <dl><dt>Numero total de recrutas:</dt>                            <dd><input id="field1" step="1" value="" data-type="field" max="10" min="0" type="number" /></dd>                        </dl>  <dl><dt>Numero de recrutas aprovados:</dt>                            <dd><input id="field2" step="1" value="" data-type="field" max="10" min="0" type="number" /></dd>                        </dl>  <dl><dt>Nick do Guia:</dt>                            <dd><input id="field3" value="" data-type="field" type="text" /></dd>                        </dl>  <dl>                            <dt>Observacao (Opcional):</dt>                            <dd><textarea id="field4" data-type="field"></textarea></dd>                        </dl>  <dl><dt>Atenciosamente,</dt>                            <dd><input id="field5" value="" data-type="field" type="text" /></dd>                        </dl>            <textarea style="display:none" id="message-template-bbcode-1">[h3]Relatório de Aulas [/h3]
 
[b] Nick dos recrutas: [/b]  {field0}
 
[b] Número total de recrutas:[/b]  {field1}
 
[b] Número de recrutas aprovados:[/b]  {field2}
 
[b] Nick do Guia:[/b]  {field3}
 
[b] Observação (Opcional):[/b]  {field4}
 
 
Atenciosamente,  {field5}
</textarea>            <input value="" name="attach_sig" type="hidden" />            <input value="reply" name="mode" type="hidden" />            <input value="51" name="t" type="hidden" />            <input value="146" name="lt" type="hidden" />            <input value="1" name="notify" type="hidden" />            <input value="Enviar" class="button2" name="post" type="submit" />                          <textarea style="display:none" name="message"></textarea>             
</form><style>#generated_form input , #generated_form textarea {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
  margin-left:35%;
 border-radius:5px;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:23%!important;
margin-left:54%;
}
</style>

Lembrando que caso queira nesse mesmo estilo, você pode colocar esse código no fim de seus formulários :
Código:
<style>#generated_form input , #generated_form textarea {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
  margin-left:35%;
 border-radius:5px;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:23%!important;
margin-left:54%;
}
</style>

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 29/07/16, 10:30 am

O <style> deve ser colocado no lugar do antigo ou deixar o antigo lá e colocar o novo em baixo? (no fim)
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 29/07/16, 10:33 am

Bom autor, deixei assim para ficar mais fácil ao senhor, não faz muita importância se ter no inicio e no fim... mas se quiser deixar organizado, você pode tirar o <style> e </style> no código que forneci, e procurar no seu formulário por <style> e deixar o código entre eles.

Deu o resultado esperado?
Sua dúvida foi sanada?

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 29/07/16, 10:37 am

Um dos formulários ficou bugado, codigo:

Código:
<br />               <script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js"></script>
               <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
            <script src="http://ajuda.forumeiros.com/29110.js"></script>
                <script src="http://ajuda.forumeiros.com/28074.js"></script>
                <style>
                  /*--- NOVO ESTILO DE FORMULARIO ---*/
                  #generated_form input , #generated_form textarea {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
  margin-left:35%;
 border-radius:5px;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:23%!important;
margin-left:54%;
}
                  /*--- FIM NOVO ESTILO DE FORMULARIO---*/
            #generated_form .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -600px; width: 60px; height: 20px;}
#generated_form .more { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px 2px; width: 12px; height: 20px; cursor:pointer;}
#generated_form .image .part { background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat -235px -548px; width: 60px; height: 20px;}
#generated_form .remove { float: left;background: url(http://i46.tinypic.com/2wrdc42.jpg) no-repeat 0px -286px;padding-left: 16px;width: 12px; height: 20px; cursor:pointer;position: relative;top:3px;}
#generated_form .image { width: 300px; }
 
#generated_form h1 {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 2em;
font-weight: 400;
margin: .8em 0 .2em;
}
 
#generated_form dl {
   margin-bottom: 10px;
   font-size: 1.1em;
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}
 
#generated_form dt {
   width: 30%;
   padding-top: 5px;
   border: none;
   float: left;
}
 
#generated_form dd {
   padding: 5px;
   padding-right: 5px;
   margin-left: 30%;
   vertical-align: middle;
}
#generated_form dl:hover dt {
   color: #666;
}
 
#generated_form input {
   font-family: "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
   font-weight: normal;
   color: #333333;
   padding: 2px;
   vertical-align: middle;
   padding-left: 4px;
}
 
#generated_form input[disabled] {
   background-color:#ddd;
   cursor:pointer;
}
 
#generated_form select {
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
   font-weight: normal;
   font-style: normal;
   cursor: default;
   vertical-align: middle;
   width:auto;
   max-width:100%;/* Bug IE */
   padding: 1px;
}
 
#generated_form textarea {
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
   width: 300px;
   height: 100px;
   padding: 2px;
   padding-left: 4px;
   cursor: text;
}
 
#generated_form input[type=text], #generated_form input[type=fields_list] {
   width: 300px;
   cursor: text;
}
</style>
          


 <form onsubmit="submit_form();" action="/post" id="generated_form" method="post" enctype="multipart/form-data">

 <input type="hidden" name="form_mode" value="1">

<h1 data-type="field">Relatório de aplicação de punições</h1>

<p data-type="field"><span style="color: rgb(46, 49, 51); font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height: 14.3px; background-color: rgb(242, 242, 242);">Preencha os campos abaixo com o que for pedido. Os campos marcados como "Opcional", não precisam ser preenchidos obrigatoriamente.</span></p>

<dl><dt>Nick do funcionário:</dt>
                            <dd><input type="text" data-type="field" value="" id="field2"></dd>
                        </dl>

<dl><dt>Cargo:</dt>
                            <dd><input type="text" data-type="field" value="" id="field3"></dd>
                        </dl>

<dl>
                            <dt>Tipo de punição:</dt>
                            <dd><select data-type="field" id="field4"><option value="Verbal">Verbal</option><option value="Continência">Continência</option></select></dd>
                        </dl>

<dl><dt>Tempo (Continência):</dt>
                            <dd><input type="number" min="0" max="10" data-type="field" value="" step="1" id="field5"></dd>
                        </dl>

<dl>
                            <dt>Motivo:</dt>
                            <dd><textarea data-type="field" id="field6"></textarea></dd>
                        </dl>

<dl><dt>Atenciosamente,</dt>
                            <dd><input type="text" data-type="field" value="" id="field7"></dd>
                        </dl>


         <textarea id="message-template-bbcode-1" style="display:none">[h3]Relatório de aplicação de punições[/h3]

[b]Nick do funcionário:[/b]   {field2}

[b]Cargo:[/b]{field3}

[b]Tipo de punição:[/b]   {field4}

[b]Tempo (Continência):[/b]   {field5}

[b]Motivo:[/b]   {field6}

Atenciosamente,   {field7}</textarea>
            <input type="hidden" name="attach_sig" value="">
            <input type="hidden" name="mode" value="reply">
            <input type="hidden" name="t" value="32">
            <input type="hidden" name="lt" value="146">
            <input type="hidden" name="notify" value="1">
            <input type="submit" name="post" class="button2" value="Enviar">
         
                <textarea name="message" style="display:none"></textarea>
           

</form>

Print: 
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 29/07/16, 10:43 am

Ok, mas esse é o ultimo que lhe ajudo ok?
Sinão vai ficar poluído o fórum, tente fazer sozinho... foi por isto que te passei o código que utilizei, ao invez de ter passado a pagina html.

Nesse formulário você troque o código que passei por este:
Código:
#generated_form input , #generated_form textarea, #generated_form select {
    background: #FCFCFC none repeat scroll 0 0;
    border: 1px solid #D4D4D4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
    color: #9F9F9F;
    padding: 6px;
    text-shadow: 0 1px 0 #FFF;
  margin-left:35%;
 border-radius:5px;
}
#generated_form > input.button2 {
color:#000!important;
text-align:center!important;
background:green!important;
text-shadow: none!important;
box-shadow: none!important;
border: none!important;
padding:10px!important;
width:23%!important;
margin-left:54%;
}

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar formulário

Mensagem por Luiz em 29/07/16, 11:00 am

Obrigado, While, agora deu certo!   Tive uma idéia!

Obrigado Luig também 
pode fechar, muito obrigado a todos que me ajudaram
avatar

Luiz
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 22/04/2016
Mensagens : 5784
Pontos Ativos : 6616

Ver perfil do usuário https://github.com/lffg/

Resolvido Re: Personalizar formulário

Mensagem por while em 29/07/16, 11:25 am

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3106
Pontos Ativos : 4514

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum