10 Questions
¿Qué se menciona como una forma de crear diseños originales en el diseño de páginas?
Crear estructuras diferentes a las habituales
¿Qué elementos conforman la estructura más simple mencionada en el texto para el diseño de páginas?
Cabecera, menú lateral izquierdo, bloque central de contenidos y pie de página
¿Qué recomendación se da antes de escribir el código del diseño de una página?
Hacer un esquema o dibujo de cómo se quiere visualizar la página
¿Cuál es uno de los aspectos mencionados en el texto acerca de cambiar la posición, tamaño y cantidad de los bloques en una página?
Es cuestión de seguir los mismos pasos aprendidos
¿Cuál es la función de una columna lateral según el texto?
Estar ubicada a la derecha de la página
¿Por qué se recomienda aprender a crear una página con varios bloques de contenidos según el texto?
Para facilitar cambios futuros en la posición y cantidad de bloques
¿Qué se destaca como clave para diseñar páginas distintas de las habituales según el texto?
Utilizar la imaginación y el buen gusto
¿Cuál es uno de los propósitos del esquema o dibujo previo que se recomienda hacer antes de escribir el código de una página?
Facilitar el trabajo posterior al visualizar la distribución de los bloques
¿Cuál es uno de los elementos comunes en las estructuras mencionadas para el diseño de páginas?
Cabecera y tres columnas
¿En qué etapa del proceso se recomienda realizar un dibujo o esquema previo antes de escribir el código del diseño?
Durante la etapa inicial antes de comenzar a codificar
Study Notes
Formas de aplicar estilos CSS
- CSS permite aplicar estilos a párrafos o etiquetas de varias manera: en la propia línea de HTML (aplicación de estilos en línea), en la parte inicial del documento HTML (aplicación de estilos interna) o en un archivo de extensión .css independiente del archivo HTML (aplicación de estilos externa)
Estilos en línea
- Se utiliza el atributo
stylepara aplicar estilos en línea a etiquetas HTML - Sintaxis para aplicar un estilo en línea: ``
- Ejemplo:
<p style="color:#0000FF;">
Propiedades de fondo
- La propiedad
background-repeatcontrola la forma en que se repite la imagen de fondo - Valores que puede tomar la propiedad
background-repeat:-
repeat: repite la imagen en sentido vertical y horizontal -
repeat-x: repite la imagen solo en horizontal -
repeat-y: repite la imagen solo en vertical -
no-repeat: muestra una sola vez la imagen y no se repite en ninguna dirección
-
- La propiedad
background-positioncontrola la posición de la imagen de fondo
Creación de cajas con CSS
- Una caja es un elemento HTML con contenido que puede tener propiedades como color de fondo, relleno y bordes
- Para crear una caja, se utiliza la etiqueta
divcon el atributoidoclass - Una caja puede contener varios elementos como párrafos, imágenes, enlaces, etc.
- Propiedades CSS para definir una caja:
-
border: define el borde -
padding: define el relleno -
margin: define los márgenes -
background-imageybackground-color: definen la imagen y el color de fondo
-
Tamaño y posición de cajas
- Se pueden definir el tamaño de una caja utilizando las propiedades
widthyheight - Se pueden posicionar los elementos utilizando las propiedades
top,bottom,left,right - Tipos de posicionamiento:
- Posicionamiento relativo: el punto de referencia es la esquina superior izquierda del elemento contenedor
- Posicionamiento absoluto: el punto de referencia es la ventana del navegador
- La propiedad
positionadmite los siguientes valores:-
static: valor por defecto, muestra los elementos tal y como se ven si no se aplica la propiedad - Otros valores de la propiedad
positionpueden ser utilizados para desplazar el elemento
-
Aprende cómo crear una caja con múltiples etiquetas HTML dentro de ella utilizando CSS. Desde agregar color de fondo, relleno y bordes a varios elementos como párrafos, imágenes y listas, hasta englobarlos con un borde común. Descubre cómo estructurar y diseñar cajas creativas en tu página web.
Make Your Own Quizzes and Flashcards
Convert your notes into interactive study material.
Get started for free
