Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

ystaile

Personalizar botões de caixa de texto

Recommended Posts

Olá, eu gostaria de saber como eu personalizo um botão e caixa de texto?Tipo....uma busca, eu gostaria de criar meu proprio botão e no caixa de texto eu gostaria de fazer uma caixa feito com traços.Obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

olha com CSS você consegue isto ex.:

 

arquivo css:

<style>a:link {color=blue}a:visited {color=blue}A:link { TEXT-DECORATION: none; }A:visited { TEXT-DECORATION: none; }A:hover { TEXT-DECORATION: underline; }BODY {background: #eeeeee;scrollbar-face-color: #87eefa;scrollbar-highlight-color: #ffffff;scrollbar-3dlight-color: #87cefa;scrollbar-darkshadow-color: #000000;scrollbar-shadow-color: #00008h;scrollbar-arrow-color: #ffffff;scrollbar-track-color: #afeeee;}.opaco{	filter: alpha(opacity=50);}.tb1{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: "blue";	border: 1px solid #6495ed;	background-image:url('../img/menu_bg.gif');}.tb2{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: "blue";	border: 1px solid #007FFF;}.tb3{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: "blue";	border: 1px solid #6495ed;}.tb4{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: "blue";	border: 0px solid #6495ed;}.tb5{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: "red";	border: 1px solid "red";}.tb6{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 12px;	color: "red";	border: 0px solid "red";}.bt{	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: #007FFF;	background: #FFFFFF;	border: 1px solid #007FFF;}</style>

salveo como estilo.css

faça areferencia a ua pagina assim

 

<link rel="stylesheet" href="estilo.css" type="text/css">

e nos input e button faça isto:

<input type="text" name"estilo" class="tb3">

altere o arquivo css para as suas necessidades qq coisa tamos ai...

Compartilhar este post


Link para o post
Compartilhar em outros sites

você faz a referencia ao estilo usando class="estilo" ex:

 

<link rel="stylesheet" href="estilo.css" type="text/css"><table border="0" width="370" cellspacing="0"><tr>    <td align="">        <img src="img/suges.gif">    </td></tr></table><table border="0" width="350" cellspacing="0" class="tb3"><tr>    <td class="tb4">           <br>           Nome:    </td>    <td>       <br>        <form method="post" action=" ">              <input class="tb3" type="text" name="nome" size="35" maxlength="15"><font face="arial" color="red" size="1"> *</font> <br>    </td></tr><tr>    <td class="tb4">           Empresa:    </td>    <td>              <input class="tb3" type="text" name="empresa" size="25" maxlength="25"><br>    </td></tr><tr>    <td class="tb4">           Tel.:    </td>    <td>              <input class="tb3" type="text" name="tel" size="10" maxlength="10"><br>     </td></tr><tr>    <td class="tb4" valign="top">           Comentario:    </td>    <td valign="top">             <textarea class="tb3"  name="sugest" style="height:60 px;width:250 px;" size="100" ></textarea> <font face="arial" color="red" size="1"> *<br><br></font>    </td></tr><tr>    <td colspan="2">        <center>              <input class="bt" type="submit" value="Envia">              <input class="bt" type="reset" value="Limpa">        </form>    </td></tr></table>

como você pode ver acima, os campos input e até mesmo as tabelas fazerm referencia as classes do CSS, por exemplo se eu fizer uma referencia a tb3 então o objeto tera a seguinte "configuração":

 

.tb3{font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 11px;  <----aqui define a fonte com tamanho de 11pxcolor: "blue"; <----aqui define a cor da fonteborder: 1px solid #6495ed; <----aqui define a borda com 1px de largura com a cor #6495ed}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Você pode tb colocar uma img de imput tipo assim.<form name="form1" method="post" action="www.seusite.com.br/form_action.php"> <input name="imageField" type="image" src="img.jpg" width="149" height="123" border="0"></form>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.