Podcast
Questions and Answers
'@media print' se refiere a:
'@media print' se refiere a:
'@media (max-width: 600px)' indica que:
'@media (max-width: 600px)' indica que:
'@media (min-width: 900px)' sería utilizado para:
'@media (min-width: 900px)' sería utilizado para:
'@media all' se utiliza para:
'@media all' se utiliza para:
Signup and view all the answers
¿Cuál es la principal desventaja de utilizar tamaños de letra en pixeles en páginas web?
¿Cuál es la principal desventaja de utilizar tamaños de letra en pixeles en páginas web?
Signup and view all the answers
¿Qué propiedad se utiliza para controlar el tamaño de la letra en CSS?
¿Qué propiedad se utiliza para controlar el tamaño de la letra en CSS?
Signup and view all the answers
¿Qué tipo de valores se utilizan en la propiedad 'font-size' para controlar el tamaño de la letra?
¿Qué tipo de valores se utilizan en la propiedad 'font-size' para controlar el tamaño de la letra?
Signup and view all the answers
¿Qué ocurre si queremos utilizar una fuente que no está instalada en la computadora del usuario?
¿Qué ocurre si queremos utilizar una fuente que no está instalada en la computadora del usuario?
Signup and view all the answers
¿Cuál es el tamaño estándar de un párrafo en píxeles?
¿Cuál es el tamaño estándar de un párrafo en píxeles?
Signup and view all the answers
¿Qué significa que un tamaño de letra sea 'absoluto' en CSS?
¿Qué significa que un tamaño de letra sea 'absoluto' en CSS?
Signup and view all the answers
'@media (min-width: 900px)' se utiliza para:
'@media (min-width: 900px)' se utiliza para:
Signup and view all the answers
Study Notes
Media Queries
- Se pueden especificar el ancho y alto de un contenido para que se adapte a una pantalla de escritorio o de celular.
- Se utilizan para crear diseños adaptables en diferentes tipos de pantallas.
- Ejemplo de media query:
@media (max-width: 600px) { p { display: block; background-color: black; color: red; } }
Tipos de Medios
- Existen diferentes tipos de medios en los que se pueden mostrar las páginas web.
- Algunos ejemplos son:
-
screen: Monitores o pantallas de ordenador. -
print: Documentos de medios impresos o pantallas de previsualización de impresión. -
all: Todos los dispositivos o medios.
-
Estrategias de Diseño
- Existen dos estrategias de diseño principales:
-
Mobile first: Se enfoca en dispositivos móviles y luego en otros dispositivos. -
Desktop first: Se enfoca en dispositivos de escritorio y luego en otros dispositivos.
-
DISEÑO ADAPTABLE
- Hace que una página se vea bien en cualquier tamaño de dispositivo.
- Utiliza HTML y CSS.
- Se utiliza el área visible de una página (viewport) para adaptarse a diferentes tamaños de pantalla.
Configuración de Ancho y Alto
- Se pueden configurar el ancho y alto de la página utilizando porcentajes.
- Se utilizan las propiedades
max-width,max-height,min-widthymin-heightpara establecer límites para el contenido.
Media Query
- Regla o conjunto de reglas que se introducen en una hoja de estilo CSS para definir propiedades específicas para distintos tipos de medios.
- Ejemplo de media query:
@media screen { p { background-color: blue; color: white; } }
CSS
- Se utiliza para estilizar elementos escritos en HTML.
- Separa el contenido de la representación visual del sitio.
- Se utilizan selectores, propiedades y valores para definir el estilo.
Colores
- Se pueden agregar colores utilizando nombres de colores, códigos hexadecimales, valores de RGB y valores HSL.
- Hay 147 colores definidos en HTML.
- Se pueden utilizar propiedades como
colorybackground-colorpara agregar colores.
Tipos de Letra
- Se utilizan para hacer que un sitio se vea único y atractivo.
- Algunos tipos de letra comunes son
Serif,Sans-serifyMonospace. - Se utiliza la propiedad
font-familypara definir el tipo de letra.
Studying That Suits You
Use AI to generate personalized quizzes and flashcards to suit your learning preferences.
Description
Learn about responsive design strategies and techniques to adapt websites to various screen sizes and devices. Explore the concepts of mobile-first and desktop-first design approaches.
