Hola amigos.
 
Hoy les traigo un codigo Fabuloso que Seguro lo usaran en sus Web's. 
 
El codigo que les traigo, es un Buscador de Usuarios de PWG, tambien les cuento que la Base del Codigo, fue creado por  Luupa y editado por mi . Les cuento que lo pase de Css en css hasta que mas o menos quedo algo
  
 VER VISTA PREVIA
Comenzemos.
Antes que nada, vamos a pegar el HTML
 	Cita:	 <div align="center"><!-- SG -->
 
<form id="formular" method="get" action="http://www.paginawebgratis.es/profile.php?" target="_blank" name="formular">
 
    <input type="text" id="sbi" maxlength="155" size="35" name="of" /> <input type="submit" id="sbb" name="sbb" value="Buscar" />
 
</form>
 
</div>	  
 
donde queramos que aparezca el Buscador.
 
* No debemos Cambiar Nada de hay, solo lo que esta marcado en ROJO
 
 
Y Ahora pegaremos el Css
 
 	Cita:	 #formular
 
{
 
background: #eaf8fc;
 
background-image: -moz-linear-gradient(#fff, #d4e8ec);
 
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #d4e8ec),color-stop(1, #fff));
 
 
-moz-border-radius: 35px;
 
border-radius: 35px;
 
 
border-width: 1px;
 
border-style: solid;
 
border-color: #c4d9df #a4c3ca #83afb7;
 
width: 350px;
 
height: 35px;
 
padding: 10px;
 
margin: 100px auto 50px;
 
overflow: hidden;
 
}
 
 
#search, #submit
 
{
 
float: left;
 
}
 
 
#sbi
 
{
 
padding: 5px 9px;
 
height: 23px;
 
width: 200px;
 
border: 1px solid #a4c3ca;
 
font: normal 13px 'trebuchet MS', arial, helvetica;
 
background: #f1f1f1;
 
 
-moz-border-radius: 50px 3px 3px 50px;
 
border-radius: 50px 3px 3px 50px;
 
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset, 0 1px 0 rgba(255, 255, 255, 1);
 
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset, 0 1px 0 rgba(255, 255, 255, 1);
 
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset, 0 1px 0 rgba(255, 255, 255, 1);
 
}
 
 
/* SBB */
 
 
#sbb
 
{
 
background: #6cbb6b;
 
background-image: -moz-linear-gradient(#95d788, #6cbb6b);
 
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #6cbb6b),color-stop(1, #95d788));
 
 
-moz-border-radius: 3px 50px 50px 3px;
 
border-radius: 3px 50px 50px 3px;
 
 
border-width: 1px;
 
border-style: solid;
 
border-color: #7eba7c #578e57 #447d43;
 
 
-moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
 
-webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
 
box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
 
 
height: 35px;
 
margin: 0 0 0 10px;
 
padding: 0;
 
width: 90px;
 
cursor: pointer;
 
font: bold 14px Arial, Helvetica;
 
color: #23441e;
 
 
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
 
}	  
 
en Code css sin Stylo. Oh entre las Etiquetas 
 
 	Cita:	 <style type="text/css">
 
	
 
AQUI EL CODIGO
 
	
 
	</style>	  
Si lo deceamos pegar Por ensima de la Pagina o en el Editor Html
 
Y el resultado es 
  
 
Saludos
 
BRIANPWG  
  Ultima edición por brianpwg el Mie Nov 21, 2012 4:45 pm; editado 2 veces
  |