Foros del Web » Creando para Internet » CSS »

Formulario de Búsqueda con Estilo

Estas en el tema de Formulario de Búsqueda con Estilo en el foro de CSS en Foros del Web. Alguien tiene el código css del formulario de búsqueda principal de www.phpbb.com el que aparece a la derecha del menú principal con bordes redondeados y ...
  #1 (permalink)  
Antiguo 01/09/2008, 12:09
Avatar de ASLAN  
Fecha de Ingreso: septiembre-2007
Mensajes: 419
Antigüedad: 10 años, 3 meses
Puntos: 2
Busqueda Formulario de Búsqueda con Estilo

Alguien tiene el código css del formulario de búsqueda principal de www.phpbb.com
el que aparece a la derecha del menú principal con bordes redondeados y una lupa al interior (sin botón submit)

Lo he visto en varios sitios web, así es que imagino será de libre dristibución
Gracias
__________________
Registros Akáshicos
  #2 (permalink)  
Antiguo 01/09/2008, 14:05
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Formulario de Búsqueda con Estilo

Hola Aslan:
FireFox + Web Developer o Firebug:
Código:
#navbar #search-box {
background:transparent url(http://static.phpbb.com/theme/images/bg_search.gif) no-repeat scroll 0 0;
display:block;
float:right;
height:30px;
margin:0;
position:static;
width:165px;

#navbar #search-box fieldset {
border:medium none;
padding-top:6px;
}

fieldset {
border-width:0;
font-family:Verdana,Helvetica,Arial,sans-serif;
font-size:1.1em;
}

p {
font-size:1.1em;
line-height:1.3em;
margin-bottom:1.5em;
}

#search-box input {
border-color:#0075B0;
}
Y la imagen que utiliza como fondo:
Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #3 (permalink)  
Antiguo 01/09/2008, 14:22
Avatar de ASLAN  
Fecha de Ingreso: septiembre-2007
Mensajes: 419
Antigüedad: 10 años, 3 meses
Puntos: 2
Respuesta: Formulario de Búsqueda con Estilo

Muchas gracias
No veo la implementación HTML, pero la conseguiré del sitio web en cuestión
Veré cómo queda en mi web y les comento
Gracias nuevamente
__________________
Registros Akáshicos
  #4 (permalink)  
Antiguo 01/09/2008, 14:34
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Formulario de Búsqueda con Estilo

Bueno, como decías:
Cita:
Iniciado por ASLAN Ver Mensaje
Alguien tiene el código css del formulario de búsqueda principal de www.phpbb.com el que aparece a la derecha del menú principal con bordes redondeados y una lupa al interior (sin botón submit)
De nuevo Firefox: "Ver --> Código fuente de la página"
Código:
<li id="search-box">
				<fieldset>
					<!-- Google CSE Search Box Begins -->
					<form method="get" action="/search/?sid=a9553bb4a50b2364748d0828aec7f484">
					  <p><input name="q" id="q" type="text" size="40" value="" /></p>
					 </form>
				</fieldset>
			</li>
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 01/09/2008, 14:38
Avatar de ASLAN  
Fecha de Ingreso: septiembre-2007
Mensajes: 419
Antigüedad: 10 años, 3 meses
Puntos: 2
Respuesta: Formulario de Búsqueda con Estilo

Gracias man
Eres muy amable
__________________
Registros Akáshicos
  #6 (permalink)  
Antiguo 01/09/2008, 21:29
Avatar de ASLAN  
Fecha de Ingreso: septiembre-2007
Mensajes: 419
Antigüedad: 10 años, 3 meses
Puntos: 2
Respuesta: Formulario de Búsqueda con Estilo

Finalmente lo hice "manualmente" así:
Código:
			<div style="background:url('header/azul.png') no-repeat;">
				<form method="post" action="presearch.php">
				<br style="line-height: 18px;" />
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="keyword" size="14" style="border-style: none; border-width: 0; font-size: 12px;" />
				<br /><br />
				</form>
			</div>
Con esta imagen

El resultado se puede ver aquí: www.ComunidadHolistica.org

Gracias por la ayuda
__________________
Registros Akáshicos

Última edición por ASLAN; 04/09/2008 a las 16:22
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:16.