Foros del Web » Creando para Internet » CSS »

Menu CSS en Home.php

 Estas en el tema de Menu CSS en Home.php en el foro de CSS en Foros del Web. Hola pues como dice tengo un menu css que encontre y modifique bastante, el punto es que quiero agregarlo a una pagina home que creo ...
  #1 (permalink)  
Antiguo 26/03/2011, 16:56
 
Fecha de Ingreso: marzo-2011
Mensajes: 4
Antigüedad: 14 años, 7 meses
Puntos: 0
Pregunta Menu CSS en Home.php
Hola pues como dice tengo un menu css que encontre y modifique bastante, el punto es que quiero agregarlo a una pagina home que creo en php, lo he hecho con el include, y si me lo incluye el problema es que quiero que solo me incluya el mero "menu" pero me toma bastante espacio como que fuera una pagina completa(me usa toda la pantalla), mi menu es practicamente una linea pero ocupa mucho espacio, habra otra forma de meter ese menu a mis diferentes paginas php???.

dejo los codigos:
estilos.css
Código: 
@charset "utf-8";
/* CSS Document */

* { margin: 0px;
padding: 0px; outline: 0;
}
html, body { width: 100%;}

body { background: #000;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu {  text-align: center;
font-size: 0.7em;
width: 820px;
margin: 20px auto;
}
#menu ul { list-style-type: none;}
#menu ul li.nivel1 { float: left;
width: 162px;
margin-right: 2px;
}
#menu ul li a {display: block;
text-decoration:none;
color: #fff;
background-color: #365;
border: solid 1px #fff;
padding: 8px;
position: relative;
}
#menu ul li:hover {position: relative;
}
#menu ul li a:hover, #menu ul li:hover a.nivel1 {background-color: #fff;
color: #000;
position: relative;
}
#menu ul li a.nivel1 {display: block!important;display: none;
position: relative;
}
#menu ul li ul {display: none;
}
#menu ul li a:hover ul, #menu ul li:hover ul {display: block;
position: absolute;left: 0px;
}
#menu ul li ul li a {width: 160px;
padding: 6px 0px 8px 0px;
border-top-color: #000;
}
#menu ul li ul li a:hover {border-top-color: #000;
position: relative;
}
table.falsa {border-collapse:collapse;
border:0px;
float: left;
position: relative;
}


este es el menu:
Código: 
<<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
  <title>Galerias</title>
  <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="estilos.css" type="text/css" />
</head>
<body>
<div id="menu">
<ul>
  <li class="nivel1"><a href="home.php" class="nivel1">Página inicio</a>
	<ul>
		<li><a href="#">Opción 1.1</a></li>
		<li><a href="#">Opción 1.2</a></li>
	</ul>

  </li>
  <li class="nivel1"><a href="#" class="nivel1">55</a>

	<ul>
		<li><a href="#">55</a></li>
		<li><a href="#">5</a></li>
		<li><a href="#">5s</a></li>
		<li><a href="#">Opción 2.4</a></li>
		<li><a href="#">Opción 2.5</a></li>

	</ul>

</li>
  <li class="nivel1"><a href="#" class="nivel1">555</a>
	<ul>
		<li><a href="#">(Pag wiki)</a></li>
		<li><a href="#">(algun mapa)</a></li>
		<li><a href="#">(min tur) etc.</a></li>

	</ul>

</li>
  <li class="nivel1"><a href="#" class="nivel1">Registrate</a>

	<ul>
		<li><a href="#">Opción 4.1</a></li>
		<li><a href="#">Opción 4.2</a></li>
		<li><a href="#">Opción 4.3</a></li>

		<li><a href="#">Opción 4.4</a></li>
	</ul>

</li>
  <li class="nivel1"><a href="#" class="nivel1">op5</a>

	<ul>
		<li><a href="#">Opción 5.1</a></li>
		<li><a href="#">Opción 5.2</a></li>

		<li><a href="#">Opción 5.3</a></li>
	</ul>

</li>
</ul>
</div>
</body>
</html>
  #2 (permalink)  
Antiguo 26/03/2011, 18:58
Avatar de Triby
Mod on free time
  
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 10.106
Antigüedad: 17 años, 2 meses
Puntos: 2237
Respuesta: Menu CSS en Home.php
En el menu debes eliminar todo el codigo html que no corresponda al menu, desde <body> hacia arriba y desde </body> hacia abajo, se supone que encabezado y pie de pagina debes manejarlos por separado.
__________________
- León, Guanajuato
- GV-Foto
  #3 (permalink)  
Antiguo 26/03/2011, 19:03
 
Fecha de Ingreso: marzo-2011
Mensajes: 4
Antigüedad: 14 años, 7 meses
Puntos: 0
Respuesta: Menu CSS en Home.php
Gracias por responder, pero de hacer lo que dices donde definire la hoja de estilos? ya que esta en el head...
  #4 (permalink)  
Antiguo 26/03/2011, 19:07
Avatar de abimaelrc
Colaborador
  
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.734
Antigüedad: 16 años, 5 meses
Puntos: 1517
Respuesta: Menu CSS en Home.php
En un archivo aparte, que diga algo como nombreQueQuieras.css y luego en el head escribes algo como
Código HTML: 
Ver original
  1. <link rel="stylesheet" type="text/css" media="screen" href="nombreQueQuieras.css" />
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #5 (permalink)  
Antiguo 26/03/2011, 19:11
Avatar de Triby
Mod on free time
  
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 10.106
Antigüedad: 17 años, 2 meses
Puntos: 2237
Respuesta: Menu CSS en Home.php
A ver, mas claro, ni el agua:

1- Necesitas un archivo 'encabezado.php' donde tengas desde <html> hasta <body>
2- El archivo del menu, que ya lo tienes
3- Incluir los dos anteriores, mostrar el contenido de la pagina y seguir con el # 4
4- Otro archivo 'pie_de_pagina.php' donde tengas todos los elementos en comun para todas las paginas y cierres de </body> y </html>

Si quieres simplificar un poco, en encabezado puedes tener tambien el menu, pero depende mucho del diseño y tu forma de programar.
__________________
- León, Guanajuato
- GV-Foto
  #6 (permalink)  
Antiguo 26/03/2011, 19:25
 
Fecha de Ingreso: marzo-2011
Mensajes: 4
Antigüedad: 14 años, 7 meses
Puntos: 0
Respuesta: Menu CSS en Home.php
ohhh creo que ya entendi a lo que te refieres, necesito mi menu.html luego otra pagina con mi contenido de pagina.php y luego una tercera que sera mi index.php, por decir algo, es esto cierto? aun asi creo q me faltaria entender muy bien ya que me dices que del menu.hmtl borre desde body para arriba, pero ahi tengo
<head>
<title>Galerias</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="estilos.css" media="screen" type="text/css" />
</head>
<body>
que es donde defino el estilo, disculpa si soy novato y me cuesta un poco.
  #7 (permalink)  
Antiguo 26/03/2011, 19:37
Avatar de Triby
Mod on free time
  
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 10.106
Antigüedad: 17 años, 2 meses
Puntos: 2237
Respuesta: Menu CSS en Home.php
Código PHP: 
Ver original
  1. // Incluyes el encabezado, con todo y menu
  2. include 'encabezado.php';
  3.  
  4. // Muestras el contenido de tu pagina, con echo, include, etc.
  5.  
  6. // Incluyes el pie de pagina
  7. include 'pie_de_pagina.php';

encabezado.php
Código HTML: 
Ver original
  1. <<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
  3. <head>
  4.   <title>Galerias</title>
  5.   <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
  6. <link rel="stylesheet" href="estilos.css" type="text/css" />
  7. </head>
  8. <body>
  9. <div id="menu">
  10. <ul>
  11.   <li class="nivel1"><a href="home.php" class="nivel1">Página inicio</a>
  12.     <ul>
  13.         <li><a href="#">Opción 1.1</a></li>
  14.         <li><a href="#">Opción 1.2</a></li>
  15.     </ul>
  16.  
  17.   </li>
  18.   <li class="nivel1"><a href="#" class="nivel1">55</a>
  19.  
  20.     <ul>
  21.         <li><a href="#">55</a></li>
  22.         <li><a href="#">5</a></li>
  23.         <li><a href="#">5s</a></li>
  24.         <li><a href="#">Opción 2.4</a></li>
  25.         <li><a href="#">Opción 2.5</a></li>
  26.  
  27.     </ul>
  28.  
  29. </li>
  30.   <li class="nivel1"><a href="#" class="nivel1">555</a>
  31.     <ul>
  32.         <li><a href="#">(Pag wiki)</a></li>
  33.         <li><a href="#">(algun mapa)</a></li>
  34.         <li><a href="#">(min tur) etc.</a></li>
  35.  
  36.     </ul>
  37.  
  38. </li>
  39.   <li class="nivel1"><a href="#" class="nivel1">Registrate</a>
  40.  
  41.     <ul>
  42.         <li><a href="#">Opción 4.1</a></li>
  43.         <li><a href="#">Opción 4.2</a></li>
  44.         <li><a href="#">Opción 4.3</a></li>
  45.  
  46.         <li><a href="#">Opción 4.4</a></li>
  47.     </ul>
  48.  
  49. </li>
  50.   <li class="nivel1"><a href="#" class="nivel1">op5</a>
  51.  
  52.     <ul>
  53.         <li><a href="#">Opción 5.1</a></li>
  54.         <li><a href="#">Opción 5.2</a></li>
  55.  
  56.         <li><a href="#">Opción 5.3</a></li>
  57.     </ul>
  58.  
  59. </li>
  60. </ul>
  61. </div>
  62. <!-- Tal vez aqui tengas algun contenedor para dar formato a tu pagina (div, table, etc.) -->

pie_de_pagina.php
Código HTML: 
Ver original
  1. <!-- si dejaste alguna etiqueta abierta (div, table, etc) aqui es donde la cierras -->
  2. </body>
  3. </html>
__________________
- León, Guanajuato
- GV-Foto
  #8 (permalink)  
Antiguo 26/03/2011, 19:44
 
Fecha de Ingreso: marzo-2011
Mensajes: 4
Antigüedad: 14 años, 7 meses
Puntos: 0
Respuesta: Menu CSS en Home.php
OMG ya veo lo que tratabas de decirme, muchas gracias amigo. salio bien la prueba.
  #9 (permalink)  
Antiguo 26/03/2011, 21:31
Avatar de bocho0610  
Fecha de Ingreso: enero-2010
Ubicación: <? echo "Santiago, Chile"; ?>
Mensajes: 341
Antigüedad: 15 años, 9 meses
Puntos: 26
Respuesta: Menu CSS en Home.php
La hoja de estilo la haces llamar de home.php, como haces un include, lo toma desde la misma pagina.
__________________
Sigueme en Twitter!
Septimoarte.cl <-- Un mundo en cine.
  #10 (permalink)  
Antiguo 28/03/2011, 09:11
Avatar de GatorV
$this->role('moderador');
  
Fecha de Ingreso: mayo-2006
Ubicación: /home/ams/
Mensajes: 38.567
Antigüedad: 19 años, 5 meses
Puntos: 2135
Tema movido desde PHP a CSS

Etiquetas: php
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


« Tema Anterior | Próximo Tema »


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