Worksheets2do Corte Fundamentos desarrollo Web
Total questions: 28
Worksheet time: 34mins
En CSS, el tamaño de la fuente es una propiedad fundamental para controlar la legibilidad y el diseño de los textos en una página web. Existen varias propiedades que permiten ajustar este valor, ya sea con unidades fijas o relativas.
¿Cuál de las siguientes propiedades CSS se utiliza para establecer el tamaño de la fuente?
font-weight
font-size
text-size
line-height
CSS (Cascading Style Sheets) es una tecnología clave en el desarrollo web, pero su propósito es específico. A menudo se confunde con otros lenguajes, ya que en las aplicaciones web, hay varios lenguajes que se encargan de diferentes aspectos del desarrollo, como la lógica de negocio, la estructura del contenido y la presentación visual.
¿CSS se utiliza principalmente para la lógica del negocio en aplicaciones web?
Verdadero, CSS se utiliza para gestionar la lógica y el comportamiento de las aplicaciones.
Falso, CSS se utiliza para la presentación visual y el diseño de las páginas web, no para la lógica del negocio.
Verdadero, pero solo en aplicaciones web móviles.
Falso, CSS se usa para la gestión de bases de datos en aplicaciones web.
En diseño web, centrar el texto es una técnica común para mejorar la presentación y la alineación del contenido en una página. CSS ofrece varias propiedades que permiten controlar la alineación del texto dentro de su contenedor.
¿Qué valor de la propiedad CSS se utiliza para centrar texto dentro de un contenedor?
text-align: center
vertical-align: middle;
align-items: center;
justify-content: center
¿Qué hará el siguiente código HTML?
Crear un botón
Generar una imagen
Crear un enlace
Mostrar texto sin enlace
¿Cuál será el efecto visual total en un elemento <div> con el siguiente código CSS?
Fondo blanco, borde azul, ancho 220px
Fondo amarillo, borde negro de 1px, margen de 10px y ancho de 200px
Fondo amarillo, borde negro, ancho completo
No será visible debido al margen
Quieres agregar un enlace a un documento PDF en tu página web. ¿Cuál es la forma correcta de hacerlo?
<a src="documento.pdf">Abrir Documento</a>
<a href="documento.pdf">Abrir Documento</a>
<link href="documento.pdf">Abrir Documento</link>
<url href="documento.pdf">Abrir Documento</url>
Has aplicado el siguiente código CSS a un elemento <p> en tu página. ¿Qué efecto tendrá este código?
Cambiará el color del texto a rojo y lo hará más pequeño.
Cambiará el color del texto a azul y lo hará más grande.
Cambiará el color del texto a rojo, aumentará el tamaño de la fuente a 18px y lo pondrá en negrita.
No tendrá ningún efecto en el texto.
En el diseño web, los bordes pueden ayudar a definir claramente los elementos de la página y mejorar la estética general. Para aplicar bordes a elementos específicos, como los elementos de una lista, se utiliza CSS.
Quieres agregar un estilo de borde a todos los elementos de lista en tu página. ¿Qué código CSS deberías usar?
ol { border: 1px solid black; }
li { padding: 1px solid black; }
ul { border: 1px solid black; }
li { border: 1px solid black; }
Cuando diseñamos una página web, es esencial organizar el contenido de manera adecuada para mejorar la accesibilidad y el SEO. Los encabezados tienen un papel fundamental en la jerarquía de la información, y HTML ofrece etiquetas específicas para los títulos de diferentes niveles.
Estás diseñando una página web y quieres crear un encabezado principal. ¿Cuál de las siguientes etiquetas HTML es la más adecuada para un título principal?
<header>
<h1>
<title>
<p>
Cuando trabajamos con CSS, las clases nos permiten aplicar estilos a múltiples elementos de manera eficiente. Si deseas aplicar un estilo específico a todos los elementos con una clase particular, debes seleccionar esa clase correctamente en el código CSS.
Estás trabajando en el diseño de una página web y necesitas aplicar un estilo específico a todos los elementos con una clase particular. ¿Cuál de las siguientes opciones muestra correctamente cómo seleccionar una clase llamada "mi-clase" en CSS y cambiar el color del texto a rojo?
.mi-clase { text-color: red; }
#mi-clase { color: red; }
.mi-clase { color: red; }
class.mi-clase { color: red; }
Estás aprendiendo sobre las diferentes maneras de aplicar estilos CSS a una página web. ¿Cuáles de las siguientes opciones son formas válidas de aplicar estilos a un elemento <p>? (varias opciones de respuesta)
Estás trabajando en el diseño de una página web y necesitas ajustar el ancho de una imagen para que se adapte mejor al diseño. ¿Cuál de las siguientes propiedades CSS se utiliza para ajustar el ancho de una imagen?
Width
Height
Length
strength
En el diseño de páginas web, es común ajustar la disposición de los elementos dentro de una página. Uno de los aspectos clave es controlar el espacio entre el contenido de un elemento y su borde. Para lograr esto, en CSS se utilizan propiedades específicas que permiten modificar este espacio de manera precisa. Una de estas propiedades es crucial para crear un "relleno" dentro de los elementos. Estás diseñando una página web y deseas crear espacio entre el contenido de un elemento y su borde. ¿Cuál de las siguientes propiedades CSS se utiliza para ajustar el espacio interno de un elemento?
Madding
Pargin
Padding
Margin
Estás trabajando en el diseño de una página web y deseas agregar un margen únicamente en la parte superior de un elemento. ¿Cuál de las siguientes opciones es una manera válida de hacerlo?
elemento { margin-top: 20px; }
elemento { margin: 0 0 20px 0; }
elemento { margin: 20px 0; }
elemento { top-margin: 20px; }
margin: 10px 0 0 0;
Tienes el siguiente código HTML en tu página web:
<h1 id="elem" class="elem">Título</h1>
¿Cuál de las siguientes opciones es la forma correcta de seleccionar este elemento por su ID en CSS? (Selecciona todas las respuestas correctas)
.elem { color: blue; }
#elem { color: blue; }
h1#elem { color: blue; }
h1.elem { color: blue; }
--elem
Cual es la escritura correcta para la etiqueta tabla en html
<table ="70%" a herf border "6">
< width table ="70%" table border "6">
<table width="70%" table border "6">
Ninguna de las anteriores
¿Cuál es la propiedad CSS utilizada para cambiar el color de fondo de un elemento?
background-color
color
bg-color
color-background
Estás aprendiendo sobre los lenguajes de programación web y su sintaxis. ¿Cuál de las siguientes opciones incluye etiquetas que pertenecen al lenguaje CSS?
¿Cuál de las siguientes etiquetas representa una CELDA en una tabla en HTML?
<td>
<table>
<tr>
<cel>
En CSS, los flexbox son una técnica moderna para crear layouts de manera flexible y eficiente. Usando la propiedad display: flex, puedes alinear y distribuir elementos de manera dinámica dentro de un contenedor. Además, las propiedades como justify-content, align-items y flex-direction juegan un papel clave en cómo se distribuyen y alinean los elementos dentro de un contenedor flexible. ¿Qué propiedad CSS se utiliza para alinear los elementos a lo largo del eje principal (horizontal, por defecto) dentro de un contenedor flexible utilizando Flexbox?
align-items
justify-content
flex-direction
align-self
¿Cuál es la sintaxis correcta para aplicar una media query que afecte solo a pantallas menores de 768px?
@media screen and (max-width: 768px) { ... }
media-query(max-width: 768px)
@media only screen 768px
@media (min-width: 768px)
¿Cuál es el propósito de @media en CSS?
Aplicar estilos condicionales según el tipo de dispositivo
Cargar imágenes
Crear animaciones
Definir variables
¿Cuál es la forma correcta de hacer que una imagen sea responsiva usando CSS?
img { width: 100%; height: auto; }
img { fixed-size: true; }
img { responsive: yes; }
img { scale: auto; }
¿Cuál es el propósito de la etiqueta <meta name="viewport"> en HTML5?
Definir el color del fondo
Controlar el zoom y escala en dispositivos móviles
Agregar estilos CSS
Cargar scripts externos
¿Qué errores puedes señalar?
¿Qué errores puedes señalar?
A continuación se muestra un bloque de código CSS desorganizado. Tu tarea es reorganizarlo de manera que sea válido y funcional. El código debería aplicar un fondo amarillo a todos los párrafos (elementos <p>) dentro de un elemento con el ID "contenedor". Reorganiza las líneas de código en el orden correcto.
Selecciona el que considere esta organizado y funcional
El siguiente código CSS se aplica a un encabezado h1 en un sitio web:
¿Cuál es el propósito principal de este código?
