Mudando Cores e bordas das caixas de texto com CSS + Js
Cria-se um efeito muito bacana, não com essa cores =)
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Mudando Cores e bordas das caixas de texto com CSS + Javascript</TITLE>
<script type="text/javascript">
</script>
<style type="text/css">
body{
color: blue;
}
input {
border: solid 2px #f0f;
color: red;
}
</style>
</HEAD>
<BODY>
<form name="formulario">
<h3>Mudando Cores e bordas das caixas de texto com CSS + Javascript</h3>
<input type="text" name="campo" onclick="document.formulario.campo.style.border='2px dashed red';" onblur="document.formulario.campo.style.border='2px solid #f0f';"><br><!-- AO RECEBER O EVENTO "ONCLICK" É APLICADO O EFEITO CSS DA MUDANÇA DE COR DA BORDA, AO PERDER A SELEÇÃO COM O EVENTO "ONBLUR" A CAIXA VOLTA AO NORMAL-->
<input type="text" name="campo1" onclick="document.formulario.campo1.style.border='2px dashed blue';"onblur="document.formulario.campo1.style.border='2px solid #f0f';"><br><!-- AO RECEBER O EVENTO "ONCLICK" É APLICADO O EFEITO CSS DE MUDANÇA DA COR DA BORDA, AO PERDER A SELEÇÃO COM O EVENTO "ONBLUR" A CAIXA VOLTA AO NORMAL-->
<input type="text" name="campo2" onclick="document.formulario.campo2.style.border='2px dashed green';"onblur="document.formulario.campo2.style.border='2px solid #f0f';"><br><!-- AO RECEBER O EVENTO "ONCLICK" É APLICADO O EFEITO CSS DE MUDANÇA DA COR DA BORDA, AO PERDER A SELEÇÃO COM O EVENTO "ONBLUR" A CAIXA VOLTA AO NORMAL-->
<input type="text" name="campo3" onclick="document.formulario.campo3.style.border='2px dashed pink';"onblur="document.formulario.campo3.style.border='2px solid #f0f';"><br><!-- AO RECEBER O EVENTO "ONCLICK" É APLICADO O EFEITO CSS DE MUDANÇA DA COR DA BORDA, AO PERDER A SELEÇÃO COM O EVENTO "ONBLUR" A CAIXA VOLTA AO NORMAL-->
</BODY>
</HTML>
