foros de software libre :: chat #softwarelibre :: socios :: siguiente web/blog»

Archive for the 'CSS' Category

02nd May 2008

VeranPushed

VeranPushed es un proyecto que surge a esa extraña inquietud que tienes cuando no hay nada que hacer, y despues hablar con algunas personas para ver cual serìa loa posibilidad de que fuese oficial empece a realizarlo.

El proyecto consiste en generar estadisticas de las materias candidatas a abrirse en los cursos de verano del Instituto Tecnologico de Celaya. Lleva por nombre VeranPushed por ser una prueba piloto, es mas, ni significado tiene, simplemente se me ocurrio y ya, por lo tanto, es posible que cambie de nombre con todo y logo.

Bien, pues aqui les pongo una imagen de la primera imagen.

VeranPushed

Aqui mostrate los avances que tenga del proyecto.

Posted in CSS, diseño, personal, proyectos activos, sobre el ITC | No Comments »

13th Apr 2008

document.images y document.getElementsByName

Bien, aquí presento un ejemplo de los usos de document.images y el document.getElementsByName.

document.images: Es la colección de todas las imágenes contenidas en nuestro sitio.

document.getElementsByName(”name”): Aqui definimos que colección queremos, sin utilizar todas.

Ejemplo

Posted in CSS, codigos, diseño, web | No Comments »

04th Mar 2008

Cambiar de una hoja de estilos a otra dinámicamente

Alguna vez me pregunté como podría cambiarle el aspecto a mi página de forma rápida y fácil como si de skins se tratarán. Bien pues una posible solución es usar unas simples líneas de código PHP.

Ahora, aquí pongo una estructura de mis directorios de mi página a la que le voy a cambiar el aspecto.

  • examplecss
    • css
      • style.css
      • 001
        • bg.gif
        • logo.gif
        • style.css
    • images
      • Bruhl-design.gif
      • otre.jpg
    • index.php

Podemos darnos cuenta que tenemos una carpeta especial para nuestras hojas de estilos llamada css, y dentro de esta tenemos el archivo style.css que será nuestro estilo predeterminado ya que si no asignamos nada, lo tomara por default. Existe dentro de css un directorio llamado 001 que en su interior tiene todo lo necesario para proporcionar una segunda hoja de estilos distinta a la predeterminada, y si existiesen mas, podemos crear un segundo directorio llamado 002 por ejemplo.

Una vez definida bien nuestra estructura, miremos parte del archivo index.php.

HTML:
  1.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  2.     <title>exampleCSS :: Programacion Web</title>
  3.     <meta content="es_MX" http-equiv="Content-Language" />
  4.     <link media="all" href="css/style.css" type="text/css" rel="stylesheet" />
  5. </head>

El código anterior es lo perteneciente a nuestro head, donde también tenemos definido una tag link que nos permitirá incluir nuestra hoja de estilos para cambiar el aspecto de nuestra pagina. Vamos a cambiar el código anterior por el siguiente.

HTML:
  1.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  2.     <title>exampleCSS :: Programacion Web</title>
  3.     <meta content="es_MX" http-equiv="Content-Language" />
  4.     <?
  5.         $cssfile = $_REQUEST['cssfile'];
  6.         if(empty($cssfile))
  7.             print '<link media="all" href="css/style.css" type="text/css" rel="stylesheet" />';
  8.         else
  9.             print '<link media="all" href="'.$cssfile.'" type="text/css" rel="stylesheet" />';
  10.     ?>
  11. </head>

Ahora podemos observar que ya incluimos código PHP para determinar que hoja de estilos queremos usar para nuestra página.

Para ver los resultados, hagamos pruebas.

Prueba 1: Sin definirle una hoja de estilos tomara la predeterminada (css/style.css)

http://codeplastic.webcindario.com/examplecss/index.php

Prueba 2: Definimos una hoja distinta a la predeterminada

http://codeplastic.webcindario.com/examplecss/index.php?cssfile=http://codeplastic.webcindario.com/examplecss/css/001/style.css

Aquí podemos observar que al terminar la ruta de index.php? definimos un dato a enviar llamado cssfile que contendrá la ruta de la hoja de estilos alternativa a la predeterminada y el cambio es drástico en nuestra pagina.

Posted in CSS, codigos, web | No Comments »