Diseño Web /

[CSS] menú tipo psicoFXP

Participa en el tema [CSS] menú tipo psicoFXP en el foro Diseño Web.
hola: Estoy haciendo un menú para mi Sitio Web con CSS (estilo los de psicoFXP ...

Buscar en este tema:
1 2 >
 
  •  
    PSICO&tico escribió el 18/05/2007 a las 12:57 hs.
     
    ¿Mensaje inapropiado?
    #1 [CSS] menú tipo psicoFXP
    hola:

    Estoy haciendo un menú para mi Sitio Web con CSS (estilo los depsicoFXP) pero en el tutorial de creación de menú con CSS de CristaLab dice:
    Originalmente publicado por tuto de CristaLab
    (...)En el CSS...)
    a que se refiere??


    Por lo que yo entendí, hay que hacer un archivo CSS con el código que exponen allí y guardarlo en el mismo directorio que al htm/html/php, pero,si es así, CÓMO SABE EL EL HTM/HTML/PHP A QUÉ CSS ME ESTOY REFIRIENDO!!!??? :ohhh:

    Espero que puedan ayudarme

    CHAO
    GRAX
    +
     
    0
    Me gusta
     
    http://www.psicofxp.com/forums/diseno-web.210/453857-css-menu-tipo-psicofxp.html
    | Más
  • alanreid escribió el 18/05/2007 a las 13:12 hs. ¿Mensaje inapropiado?

    #2 Re: menú tipo psicoFXP

    En el html ponés:
    Código:
    <link href="estilo.css" rel="stylesheet" type="text/css" />
    
    Salu2
    Alan
    Me gusta este mensaje
  • PSICO&tico escribió el 18/05/2007 a las 14:33 hs. ¿Mensaje inapropiado?

    #3 Re: menú tipo psicoFXP

    Y eso en que parte iría???

    CHAO
    GRAX
    Me gusta este mensaje
  • alanreid escribió el 18/05/2007 a las 14:39 hs. ¿Mensaje inapropiado?

    #4 Re: menú tipo psicoFXP

    en head
    Me gusta este mensaje
  • PSICO&tico escribió el 18/05/2007 a las 15:24 hs. ¿Mensaje inapropiado?

    #5 Re: menú tipo psicoFXP

    OK GRCIAS ALAN

    nos vemos por google

    CHAO
    GRAX
    Me gusta este mensaje
  • alanreid escribió el 18/05/2007 a las 15:49 hs. ¿Mensaje inapropiado?

    #6 Re: menú tipo psicoFXP

    Not this time...
    Me gusta este mensaje
  • PSICO&tico escribió el 18/05/2007 a las 17:02 hs. ¿Mensaje inapropiado?

    #7 Re: menú tipo psicoFXP

    hola volvi:

    ahora el problema es que no me poné los menúess!!! :@

    les dejo el
    Código:
    #navi {  
    	list-style:none;
    	margin:0;
    	padding:0;
    	float:left
    }
    #navi li {
    	margin:2px;
    	padding:0;
    }
    #navi li a {
    	display:block;
    	width:100px;
    	padding:4px 0;
    	text-decoration:none;
    	text-align:center;
    	font-size:11px;
    	color:#FFFFFF;
    	background-color:#000000;
    	border-left:10px solid #666666;
    }
    #navi li a:hover {
    	color:#99CC00;
    	background-color:#003366;
    	border-left-color:#99CC00;
    }
    
    y menos mal que lo copie y estoy probando porque si le hubiese puesto los colores asesinaría a alguien (sentido figurado)

    AIUTA PER FAVORE! AIUTA!


    CHAO
    GRAX


    PD: probé con "float:left", "float:right", "float:inherit", y por las dudas, "float:none"
    Me gusta este mensaje
  • alanreid escribió el 18/05/2007 a las 17:11 hs. ¿Mensaje inapropiado?

    #8 Re: menú tipo psicoFXP

    Fijate que hayas puesto el id="inicio" (por ejemplo)...

    Este es el código de fuente de los 4 ejemplos que dan:
    Código PHP:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <
    html xmlns="http://www.w3.org/1999/xhtml">
    <
    head>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <
    title>Contador de visitas en básico en flash y php</title>
    <
    style type="text/css">
    <!--
    body {
        
    font-family:ArialHelveticasans-serif;
        }
    ul#uno {  
        
    list-style:none;
        
    margin:0;
        
    padding:0;
        }
    ul#uno li {
        
    margin:2px;
        
    padding:0;
        
    float:left;
        }
    ul#uno li a {
        
    display:block;
        
    width:100px;
        
    padding:4px 0;
        
    text-decoration:none;
        
    text-align:center;
        
    font-size:11px;
        
    color:#FFFFFF;
        
    background-color:#000000;
        
    }
    ul#uno li a:hover {
        
    color:#99CC00;
        
    background-color:#003366;
        
    }
    /*-----------------------------------*/    
    ul#dos {  
        
    list-style:none;
        
    margin:0;
        
    padding:0;
        }
    ul#dos li {
        
    margin:2px;
        
    padding:0;
        
    float:left;
        }
    ul#dos li a {
        
    display:block;
        
    width:100px;
        
    padding:4px 0;
        
    text-decoration:none;
        
    text-align:center;
        
    font-size:11px;
        
    color:#FFFFFF;
        
    background-color:#000000;
        
    border-left:10px solid #666666;
        
    }
    ul#dos li a:hover {
        
    color:#99CC00;
        
    background-color:#003366;
        
    border-left-color:#99CC00;
        
    }
    /*-----------------------------------*/    
    ul#tres {  
        
    list-style:none;
        
    margin:0;
        
    padding:0;
        }
    ul#tres li {
        
    margin:2px;
        
    padding:0;
        
    float:left;
        }
    ul#tres li a {
        
    display:block;
        
    width:100px;
        
    padding:40px 10px 4px 10px;
        
    text-decoration:none;
        
    text-align:right;
        
    font-size:11px;
        
    color:#666666;
        
    background-image:url(/images/tutos/cssmenus/boton1.png);
        
    border:1px solid #666666;
        
    }
    ul#tres li a:hover {
        
    color:#000000;
        
    background-position:bottom;
        }
    /*-----------------------------------*/    
    ul#cuatro {  
        
    list-style:none;
        
    margin:0;
        
    padding:0;
        }
    ul#cuatro li {
        
    padding:0;
        
    float:left;
        }
    ul#cuatro li a {
        
    display:block;
        
    width:121px;
        
    height:50px;
        
    text-decoration:none;
        }
    ul#cuatro li a:hover {
        
    background-position:bottom;
        }
    ul#cuatro li a span {
        
    display:none;
        }
    #inicio {
        
    background-image:url(/images/tutos/cssmenus/inicio.png);
        }
    #acerca {
        
    background-image:url(/images/tutos/cssmenus/acerca.png);
        }
    #contacto {
        
    background-image:url(/images/tutos/cssmenus/contacto.png);
        }
    /*-----------------------------------*/    
        

    -->
    </
    style>
    </
    head>

    <
    body>
            <
    ul>
                <
    li>item</li>
                <
    li>item</li>
                <
    li>item</li>
            </
    ul>
    <
    p>&nbsp;</p>
    <
    br />
            <
    ul id="uno">
              <
    li><a href="#">inicio</a></li>
              <
    li><a href="#">acerca de</a></li>
              <
    li><a href="#">contactos</a> </li>
            </
    ul>
    <
    p>&nbsp;</p>
    <
    br />
            <
    ul id="dos">
              <
    li><a href="#">inicio</a></li>
              <
    li><a href="#">acerca de</a></li>
              <
    li><a href="#">contactos</a> </li>
            </
    ul>
    <
    p>&nbsp;</p>
    <
    br />
            <
    ul id="tres">
              <
    li><a href="#">inicio</a></li>
              <
    li><a href="#">acerca de</a></li>
              <
    li><a href="#">contactos</a> </li>
            </
    ul>
    <
    p>&nbsp;</p>
    <
    br />
            <
    ul id="cuatro">
              <
    li><a href="#" id="inicio"><span>inicio</span></a></li>
              <
    li><a href="#" id="acerca"><span>acerca de</span></a></li>
              <
    li><a href="#" id="contacto"><span>contactos</span></a></li>
            </
    ul>
    <
    p>&nbsp;</p>
    <
    br /> 
    Me gusta este mensaje
  • PSICO&tico escribió el 18/05/2007 a las 20:57 hs. ¿Mensaje inapropiado?

    #9 Re: menú tipo psicoFXP

    hola:

    no puede hacerlo y ya voy por la página 21 de Google, si, no te rias, soy medio boludo del todo, si alguien puede hacer un html y un css con ésto hecho, por lo menos con dos menúes principales y c/menú con 2 más, para poder darme cuenta que hago mal se lo agradecería un tocazo

    PLEASE HELP ME!

    CHAO
    GRAX
    Me gusta este mensaje
  • alanreid escribió el 18/05/2007 a las 21:05 hs. ¿Mensaje inapropiado?

    #10 Re: menú tipo psicoFXP

    Nadie se va a reir de vos, nadie nace sabiendo

    Con este CSS lo único que lográs es crear un menú con imágenes y con un rollover.. nada más..
    No tiene submenues (creo que es lo que querés, no? )..
    Para eso necestiarías JavaScript.

    Este te puede servir (demo)

    Salu2
    Alan
    Me gusta este mensaje
1 2 >


Estadísticas del tema
  • 10 RESPUESTAS
  • 840 VISTAS
  • 2 USUARIOS RESPONDIERON
 
Ir arriba
Contacto | Acerca de | Ayuda | Términos Legales | privacidad | Pautas de convivencia | Mapa de los foros | TrabajÁ con nosotros
©2008 Psicofxp.com S.A. - Todos los derechos reservados
Certifica IAB