Recomendados
Más contenido relacionado
La actualidad más candente
La actualidad más candente (20)
Similar a hojas-estilos-desarrollo-web
Similar a hojas-estilos-desarrollo-web (20)
hojas-estilos-desarrollo-web
- 1. DESARROLLO WEB Hojas de Estilo Universidad Tecnológica de Tecamachalco
- 2. Indice 1. 2. 3. 4. 5. Estructura de las carpetas del proyecto Crear un hoja de estilo Definir estilos para divs Asignar estilos a los divs Visualización de los divs
- 3. 1. Estructura de las carpetas del proyecto Crear la siguiente estructura de carpetas para su proyecto, dentro de carpeta se agregaran sus archivos correspondientes Administrador.- Dentro de esa carpeta se Ubicaran todos los archivos que seran Utilizados para el rol administrador. Cajero.- Dentro de esa carpeta se ubicaran todos los archivos que seran Utilizados para el rol cajero. css.- Dentro de esta carpeta se ubicaran las hojas de estilo. Js.- Dentro de esta carpeta se ubicaran los archivos java script generados para las Funciones. themeJquery.- Dentro de esta carpeta se ubican los Arhivos descargados del tema jqueryUI. conexion.php Es un archivo que tiene la conexion A la base de datos.
- 4. 2.- Crear un hoja de estilo Para crear una hoja de estilo se da clic derecho sobre La carpeta css, y se crea un nuevo archivo (en sublime) Y después se almacena dentro de la carpeta css
- 5. 3.- Definir estilos para divs Se generan los estilos, anotando el nombre del estilo con un punto antes del nombre. ( .estilo_banner ) Dentro de las llaves del estilo se indican sus propiedas como son: largo, ancho, imagen de fondo, margen, etc. En el ejemplo solo se muestra algunas propiedades, pero existen mucho más…
- 6. Para tener una plantilla completa se deben crear por lo menos cuatro estilos (con cualquier nombre): .Estilo_Banner .Estilo_Menu .Estilo_Main .Estilo_footer Cabe mencionar que se tiene que tener mucho cuidado con los tamaños especificados para los estilos ya que seran tomados por los divs, cuando se asignan a ellos (Largo y Ancho). Podrian basarse en la imagen de la sigiente diapositva.
- 8. 4.- Asignar los estilos a los divs Dentro de la carpeta Administrador se crea los siguientes archivos y carpetas: • AdministradorMenu.php • Menu.php Y se va a generar una carpeta por cada tabla que se va a utilizer en el proyecto. • Proveedores
- 9. Contenido del archivo element del menu. Menu.php cada etiqueta <li> </li> se utiliza para generar un <a href=…> se utiliza para mandar a traer a un archivo (es un hiperinculo), es muy importante su propiedad id ya que es el identificador del hipervinculo.
- 10. Contenido del archivo AdministradorMenu.php Se importan las hojas de estilo <link rel… /> Y los archivos de java Script <script src….> </script> Archivos para Menu Es la forma a utilizar Se les agrega el evento a cada identificador de los hipervinculos (evento click()) El evento de enlaceUsuarios carga una pagina php dentro de un div (no recarga la pagina), con el metodo load() Y el evento enlaceProveedores invoca a la pagina php indicada (recaga la pagina).
- 11. La función include(); se utiliza para incrustar el código de un archivo. (Funciona como si lo copiara y lo pegare en esa linea) Se asigna los estilos a los divs, cada div tomara las propiedades del estilo indicado. Para eso ya se importo en la parte superior dentro del <head> la hoja de estilo que tiene implementados todos los estilos. NOTA: deben coincidir los nombres de los estilos asignados con los implementados.