Wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Examen final Fundamentos

Total questions: 91

Worksheet time: 15mins

Name
Class
Date
1.

¿Qué es un preprocesador?

a)

Es un lenguaje de programación.

b)

Es una tecnología que dota a un lenguaje de programación.

c)

Es un entorno de ejecución de código abierto.

d)

N.A.

2.

¿Cuáles son los preprocesadores más populares?

a)

SASS, NodeJS, Javascript

b)

Stylus, CSS, SASS

c)

LESS, HTML, CSS

d)

LESS, SASS, Stylus

3.

¿Qué es Stylus?

a)

Es un tipo de preprocesador que da características de Javascript a CSS

b)

Es un tipo de lenguaje de programación

c)

Es un tipo de preprocesador que da características de CSS a Javascript.

d)

Es un compilador de lenguajes de programación como Python.

4.

¿Qué características tiene Stylus?

a)

Uso de variables, llaves opcionales.

b)

Compresión de HTML y mixins.

c)

Cambio de color al código en Javascript y comas opcionales

d)

Añade 8 funciones disponibles y condicionales.

5.

¿Quién es el creador de Stylus?

a)

Mark Zuckerberg

b)

F.P. Cuellar

c)

TJ Holowaychuk

d)

Satoshi Nakamoto

6.

¿Qué desventajas tiene el CSS tradicional?

a)

Su sintaxis es repetitiva.

b)

Usa funciones demasiado complejas.

c)

Las condiciones solo pueden ser anidadas o dobles.

d)

Sus bucles necesitan de extensiones.

7.

¿Con qué propósito se creó Stylus?

a)

Para brindar un aspecto distinto a CSS

b)

Con el fin de tener un código más limpio y darle características adicionales a CSS.

c)

Con el fin de compilar el código en Javascript.

d)

Para cambiar de un lenguaje de programación a otro.

8.

¿En qué año se creó Stylus?

a)

2011

b)

2012

c)

2013

d)

2014

9.

¿Sobre qué programa está construido Stylus?

a)

Javascript

b)

HTML

c)

NodoJS

d)

NodeJS

10.

Cuando trabajamos con Stylus, ¿qué extensión se usa?

a)

.style

b)

.stylus

c)

.styl

d)

.sty

11.

¿Es Stylus un preprocesador de CSS, HTML o Javascript?

a)

CSS

b)

HTML

c)

Javascript

d)

N.A.

12.

En Stylus, ¿los punto y coma se omiten obligatoriamente?

a)

Sí, ya que, de lo contrario, deja de funcionar

b)

Sí, ya que el punto y coma no existe en Stylus

c)

No, porque esa no es una funcionalidad de Stylus.

d)

No, es opcional.

13.

 A diferencia del CSS, que usa llaves para abrir y cerrar los bloques de declaración, en Stylus se usa:

a)

Corchetes

b)

Paréntesis

c)

Sangría

d)

Comas

14.

En Stylus, ¿cómo se mostraría el siguiente código?:

body {

color: #222;

}

a)

Igual, pero omitiendo llaves y el punto y coma.

b)

Omitiendo llaves, dos puntos y punto y coma.

c)

No tiene forma específica.

d)

Ya está aplicado Stylus.

15.

¿Cómo se hace la asignación de variables en Stylus?

a)

Se escriben entre corchetes o llaves, a la derecha de las palabras clave.

b)

Se hace automáticamente separando la propiedad y las palabras clave.

c)

Utiliza símbolos para definirlas

d)

Stylus no admite variables.

16.

¿Cuál de las siguientes es una característica de Less?

a)

No permite el uso de variables.

b)

No soporta anidación de reglas.

c)

Permite el uso de mixins.

d)

No se puede usar en proyectos web.

17.

¿Qué es Less?

a)

Un lenguaje de programación de alto nivel.

b)

Un preprocesador de CSS.

c)

Una biblioteca JavaScript.

d)

Un framework para desarrollo de backend.

18.

¿Qué es un mixin en Less?

a)

Una herramienta para depurar código CSS.

b)

Un bloque de código CSS reutilizable.

c)

Una técnica para minimizar archivos CSS.

d)

Un archivo que importa otros archivos CSS.

19.

¿Qué función de Less se utiliza para aclarar un color?

a)

lighten

b)

brighten

c)

light

d)

lumos

20.

¿Cómo se puede reutilizar un bloque de código en diferentes partes del archivo Less?

a)

Usando variables.

b)

Usando mixins.

c)

Usando funciones.

d)

Usando comentarios.

21.

¿Qué técnica de Less permite aplicar estilos solo si se cumplen ciertas condiciones?

a)

Variables condicionales.

b)

Importación condicional.

c)

Mixins con guardas.

d)

Funciones condicionales

22.

¿Cuál de las siguientes herramientas se puede usar para compilar Less?

a)

Babel

b)

Webpack

c)

lessc

d)

TypeScript

23.

¿Para qué sirve Less?

a)

Para crear bases de datos.

b)

Para mejorar y extender las capacidades de CSS.

c)

Para editar videos.

d)

Para diseñar interfaces de usuario.

24.

¿Qué símbolo se usa para definir variables en Less?

a)

$

b)

@

c)

#

d)

&

25.

¿Cuál de las siguientes características NO es proporcionada por Less?

a)

Variables

b)

Mixins

c)

Funciones

d)

Control de versiones

26.

¿Cuál es la extensión de los archivos Less?

a)

.les

b)

.lss

c)

.less

d)

. lsx

27.

¿Cuál es una ventaja de usar Less sobre CSS tradicional?

a)

Menor compatibilidad con navegadores antiguos.

b)

Uso más complicado.

c)

Mejor mantenibilidad y organización del código.

d)

No permite anidación de selectores.

28.

¿Qué son las funciones de color en Less?

a)

Funciones que permiten calcular propiedades de texto.

b)

Funciones que ajustan y manipulan valores de color.

c)

Funciones que convierten números en colores.

d)

Funciones que eliminan colores de elementos

29.

¿Qué hace la función round () en Less?

a)

Redondea un número hacia arriba.

b)

Redondea un número hacia abajo.

c)

Redondea un número al entero más cercano

d)

Convierte un número en una cadena de texto.

30.

¿Qué es la anidación en Less?

a)

Una forma de agrupar archivos.

b)

Una manera de escribir selectores CSS dentro de otros selectores

c)

Un método para incluir imágenes.

d)

Una técnica para minificar CSS.

31.

¿Qué símbolo se utiliza para definir un mixin en Less?

a)

$

b)

@

c)

.

d)

#

32.

  1. ¿Qué es Sass?

a)

Un lenguaje de programación

b)

Un preprocesador de CSS

c)

Un framework de JavaScript

d)

Un sistema de gestión de bases de datos

33.

¿Cuál es la principal ventaja de utilizar Sass?

a)

Mejor rendimiento en la carga de páginas web

b)

Facilidad para escribir y organizar estilos CSS

c)

Integración con herramientas de desarrollo front-end

d)

Todas las anteriores

34.

¿Qué característica de Sass permite definir y reutilizar variables?

a)

Anidamiento

b)

Mixins

c)

Funciones

d)

Variables

35.

¿Cuál es la principal función de los Mixins en Sass?

a)

Definir variables globales

b)

Crear estilos personalizados reutilizables

c)

Importar archivos de estilos

d)

Compilar el código Sass a CSS

36.

¿Qué permite hacer la sintaxis anidada de Sass?

a)

Escribir código CSS de forma más compacta

b)

Organizar los estilos de manera jerárquica

c)

Definir temas y paletas de colores

d)

Optimizar el rendimiento de la página web

37.

¿Cuál es la principal diferencia entre la sintaxis anidada y la sintaxis de estilo CSS en Sass?

a)

La sintaxis anidada es más legible, la de estilo CSS es más compacta

b)

La sintaxis anidada es más compatible con frameworks CSS, la de estilo CSS no

c)

La sintaxis anidada genera más archivos CSS, la de estilo CSS genera menos

d)

No hay diferencias, ambas sintaxis son igualmente válidas en Sass

38.

¿Qué herramienta se utiliza comúnmente para compilar el código Sass a CSS?

a)

Gulp

b)

Webpack

c)

Dart Sass

d)

Todas las anteriores

39.

¿Cuál es el significado completo de la abreviatura "Sass" en inglés?

a)

Structured Application Style Sheets

b)

Syntactically Awesome Style Sheets

c)

Scalable and Sustainable Style Sheets

d)

Streamlined Adaptable Style Sheets

40.

¿Qué tipo de funcionalidades pueden crearse utilizando las funciones de Sass?

a)

Cálculos matemáticos

b)

Manipulación de colores

c)

Logica condicional

d)

Todas las anteriores

41.

¿Cuál es una de las principales tendencias actuales en el desarrollo con Sass?

a)

Integración con frameworks de JavaScript

b)

Uso de herramientas de linting y formateo

c)

Adopción de nuevas características y especificaciones CSS

d)

Todas las anteriores

42.

¿Cuál de las siguientes características de Sass permite organizar y modularizar el código?

a)

Variables

b)

Partials y @import

c)

Anidamiento

d)

Mixins

43.

¿Qué ventaja ofrece la utilización de Mixins en Sass?

a)

Mejora el rendimiento de la página web

b)

Facilita la creación de estilos personalizados y reutilizables

c)

Permite definir temas y paletas de colores

d)

Optimiza el tamaño del archivo CSS generado

44.

¿Cuál es la principal desventaja de utilizar la sintaxis anidada en Sass?

a)

Genera un código menos legible

b)

Produce archivos CSS más grandes

c)

Dificulta la integración con frameworks CSS

d)

Ninguna, la sintaxis anidada es siempre preferible

45.

¿Qué permite hacer la característica de "extends" en Sass?

a)

Definir variables globales

b)

Crear estilos personalizados reutilizables

c)

Heredar estilos de otros selectores

d)

Importar archivos de estilos

46.

¿Cuál es una de las principales tendencias futuras de Sass?

a)

Abandono gradual del uso de Sass en favor de CSS nativo

b)

Mayor integración con herramientas de desarrollo front-end

c)

Enfoque en la optimización del rendimiento de la página web

d)

Todas las anteriores

47.

¿Bootstrap es un framework de qué?

a)

Backend

b)

Frontend

c)

Base de datos

d)

Navegadores

48.

¿Cuál es la etiqueta principal utilizado para crear un formulario en html?

a)

<form>

b)

<input>

c)

<label>

d)

<div>

49.

¿Cuál de las siguientes clases de Bootstrap se utiliza para hacer que un input tenga un estilo de "form-control"?

a)

.input

b)

.input-group

c)

.form-group

d)

 .form-control

50.

En Bootstrap, ¿qué clase se utiliza para hacer que un elemento se muestre en la parte superior de una página?

a)

.top

b)

.navbar

c)

.header

d)

.topbar

51.

¿Qué etiqueta HTML se utiliza para incluir un logotipo en una página web?

a)

<logo>

b)

<img>

c)

<brand>

d)

<link>

52.

En Bootstrap, ¿cuál es la clase que se utiliza para agregar un logotipo a una barra de navegación?

a)

a).navbar-logo

b)

.navbar-Brand

c)

.logo

d)

.brand

53.

¿Cuál de las siguientes clases de Bootstrap se utiliza para crear una barra de navegación horizontal?

a)

.nav-horizontal

b)

.navbar

c)

.nav

d)

.navbar-horizontal

54.

¿Qué clase se utiliza para agrupar elementos de navegación en Bootstrap?

a)

.nav

b)

.navbar

c)

.navigation

d)

.navgroup

55.

¿Cuál es la clase de Bootstrap utilizada para crear una barra de navegación fija en la parte superior de la página?

a)

.navbar-static

b)

.navbar-fixed

c)

.fixed-top

d)

.topnav

56.

En Bootstrap, ¿cuál es la clase utilizada para crear un encabezado de página?

a)

.page-header

b)

.header

c)

.page-top

d)

.top-header

57.

En Bootstrap, ¿qué clase se utiliza para crear un diseño de cuadrícula?

a)

.grid

b)

.layout

c)

.container

d)

.row

58.

¿Cuál es la clase de Bootstrap que se utiliza para crear un botón?

a)

.button

b)

.btn

c)

.button-style

d)

.btn-style

59.

¿Cuál es la clase de Bootstrap que se utiliza para crear una lista desplegable?

a)

.dropdown-menú

b)

.dropdown-list

c)

.dropdown

d)

.menu-dropdown

60.

En Bootstrap, ¿cuál es la clase utilizada para crear un carousel o carrusel de imágenes?

a)

.slider

b)

.carousel

c)

.slides

d)

.gallery

61.

¿Cuál es la clase de Bootstrap utilizada para aplicar estilos de tipografía?

a)

.font-style

b)

.text-style

c)

.typography

d)

.font

62.

  1. ¿Qué clase de Bootstrap se utiliza para ocultar un sidebar en pantallas pequeñas?

a)

  1. .sidebar-sm-hidden

b)

  1. .d-sm-none

c)

.d-hidden-sm

d)

.sidebar-hide-sm

e)

.d-hide

63.

  1. ¿Cómo se hace para que un sidebar se despliegue desde la izquierda usando Bootstrap?

a)

A) class="sidebar-left"

b)

B) class="sidebar-expand-left"

c)

C) class="sidebar-collapse"

d)

D) class="sidebar-expand"

e)

E) class="sidebar-left-expand"

64.

  1. ¿Cuál es la clase Bootstrap para hacer que un sidebar sea fijo?

a)

  1. A) .fixed-sidebar

b)

  1. B) .sidebar-fixed

c)

  1. C) .fixed-left

d)

  1. D) .fixed-right

e)

  1. E) .sticky-top

65.

  1. ¿Qué clase Bootstrap debes usar para agregar scroll al contenido del sidebar si excede la altura de la pantalla?

a)

  1. A) .scroll-content

b)

  1. B) .overflow-auto

c)

  1. C) .sidebar-scroll

d)

  1. D) .content-scroll

e)

  1. E) .overflow-scroll

66.

  1. ¿Cómo puedes hacer que un sidebar se colapse automáticamente en pantallas pequeñas?

a)

  1. A) class="collapse-sm"

b)

  1. B) class="collapse-sidebar-sm"

c)

  1. C) class="collapse d-sm-block"

d)

  1. D) class="d-sm-collapse"

e)

  1. E) class="collapse d-sm-none"

67.

  1. ¿Qué clase Bootstrap se usa para crear un contenedor de álbum con espaciado entre los elementos?

a)

  1. A) .album-grid

b)

  1. B) .container-album

c)

  1. C) .album-container

d)

  1. D) .container-fluid

e)

  1. E) .album

68.

  1. Para crear tarjetas de álbum en Bootstrap, ¿cuál es la clase principal que debes usar?

a)

  1. A) .album-card

b)

  1. B) .card-album

c)

  1. C) .card

d)

  1. D) .album-item

e)

  1. E) .card-container

69.

  1. ¿Qué clase de Bootstrap usas para un título dentro de una tarjeta de álbum?

a)

  1. A) .card-heading

b)

  1. B) .card-title

c)

  1. C) .card-head

d)

  1. D) .card-header

e)

  1. E) .card-text

70.

  1. ¿Cómo se asegura que las imágenes dentro de un álbum en Bootstrap mantengan una proporción fija?

a)

  1. A) .img-responsive

b)

  1. B) .img-fluid

c)

  1. C) .img-proportional

d)

  1. D) .img-fixed

e)

  1. E) .img-thumbnail

71.

  1. ¿Cuál es la clase para alinear el contenido de las tarjetas de álbum en el centro?

a)

  1. A) .text-center

b)

  1. B) .align-middle

c)

  1. C) .center-content

d)

  1. D) .align-center

e)

  1. E) .center-align

72.

  1. ¿Qué clase se usa para crear un carousel en Bootstrap?

a)

A) .carousel

b)

  1. B) .carousel-container

c)

  1. C) .slider

d)

  1. D) .carousel-slider

73.

  1. ¿Cuál es la clase para los elementos individuales dentro de un carousel de Bootstrap?

a)

  1. A) .carousel-slide

b)

  1. B) .carousel-item

c)

  1. C) .carousel-element

d)

  1. D) .carousel-container

e)

  1. E) .carousel-content

74.

  1. Para que un carousel se desplace automáticamente, ¿qué atributo debes agregar?

a)

  1. A) data-slide="auto"

b)

  1. B) data-slide="carousel"

c)

  1. C) data-ride="carousel"

d)

  1. D) data-auto="true"

e)

  1. E) data-interval="true"

75.

  1. ¿Qué clase de Bootstrap se usa para agregar controles de navegación a un carousel?

a)

  1. A) .carousel-navigation

b)

  1. B) .carousel-control

c)

  1. C) .carousel-nav

d)

  1. D) .carousel-control-prev y .carousel-control-next

e)

  1. E) .carousel-arrows

76.

  1. ¿Cómo se pueden agregar indicadores de página a un carousel en Bootstrap?

a)

  1. A) .carousel-indicators

b)

  1. B) .carousel-dots

c)

  1. C) .carousel-pages

d)

  1. D) .carousel-markers

e)

  1. E) .carousel-pagination

77.

¿Qué clase de Bootstrap se utiliza comúnmente para crear una tarjeta de vista previa de una entrada de blog?

a)

a) .post-preview

b)

b) .card

c)

c) .blog-preview

d)

d) .article-card

e)

e) .entry-card

78.

¿Cuál de las siguientes clases de Bootstrap se utiliza para añadir una imagen destacada en una tarjeta de blog?

a)

a) .card-img

b)

b) .img-feature

c)

c) .post-img

d)

d) .article-img

e)

e) .entry-img

79.

¿Qué clase de Bootstrap se utiliza para estilizar el pie de una entrada de blog, donde se pueden agregar botones de compartir y etiquetas?

a)

a) .post-footer

b)

b) .blog-footer

c)

c) .card-footer

d)

d) .entry-footer

e)

e) .article-footer

80.

¿Qué clase de Bootstrap se utiliza para agrupar controles relacionados dentro de un formulario de checkout?

a)

a) .form-control

b)

b) .form-check

c)

c) .form-group

d)

d) .form-item

e)

e) .form-section

81.

¿Cómo se puede crear una sección de dirección dividida en dos columnas usando Bootstrap en un formulario de checkout?

a)

a) Usando .row y .col-6

b)

b) Usando .grid y .grid-6

c)

c) Usando .flex y .flex-6

d)

d) Usando .block y .block-6

e)

e) Usando .column y .column-6

82.

¿Qué clase se utiliza para estilizar los botones de envío en un formulario de checkout de Bootstrap?

a)

a) .btn-primary

b)

b) .btn-submit

c)

c) .btn-checkout

d)

d) .btn-order

e)

e) .btn-form

83.

¿Cuál es la clase de Bootstrap para agregar un ícono de tarjeta de crédito en el formulario de checkout?

a)

a) .icon-credit

b)

b) .form-icon

c)

c) .icon-payment

d)

d) .card-icon

e)

e) .bi-credit-card

84.

¿Qué clase de Bootstrap se utiliza comúnmente para crear una tarjeta de precio?

a)

a) .price-tag

b)

b) .price-card

c)

c) .pricing-panel

d)

d) .card

e)

e) .pricing-item

85.

Para resaltar un plan de precios específico, ¿qué clase adicional puedes usar en Bootstrap?

a)

a) .highlight

b)

b) .featured

c)

c) .special

d)

d) .card-highlight

e)

e) .card-primary

86.

¿Cuál es una práctica común para organizar los planes de precios en una página web usando Bootstrap?

a)

a) Utilizar una tabla con la clase .table-pricing

b)

b) Usar una lista desordenada con la clase .list-pricing

c)

c) Crear una fila de columnas utilizando .row y .col-*

d)

d) Utilizar un menú desplegable con la clase .dropdown-pricing

e)

e) Usar botones con la clase .btn-pricing

87.

Para añadir íconos a las características de un plan de precios, ¿qué herramienta de Bootstrap es más adecuada?

a)

a) Bootstrap Carousel

b)

b) Bootstrap Icons

c)

c) Bootstrap Grid

d)

d) Bootstrap Forms

e)

e) Bootstrap Modal

88.

¿Qué es un modal en Bootstrap?

a)

a) Un contenedor para imágenes

b)

b) Un tipo de botón.

c)

c) Un componente emergente de diálogo.

d)

d) Un estilo de texto.

e)

e) Un contenedor de video.

89.

¿Cuál es la clase principal que se usa para crear un modal en Bootstrap?

a)

a) .modal-window

b)

b) .bootstrap-modal

c)

c) .dialog-box

d)

d) .modal

e)

e) .popup

90.

¿Cuál de las siguientes clases se utiliza para definir el contenido de un modal en Bootstrap?

a)

a) .modal-content

b)

b) .modal-body

c)

c) .modal-dialog

d)

d) .modal-header

e)

e) .modal-footer

91.

¿Qué clase se utiliza para cerrar un modal en Bootstrap al hacer clic en el botón de cerrar?

a)

a) .modal-close

b)

b) .close-button

c)

c) .modal-exit

d)

d) .modal-dismiss

e)

e) .close

Similar Resources on Wayground

DISNEY

96 questions

DISNEY

quiz

Worksheet

•

1st Grade - Professio...

Canto sei do principiño???

86 questions

Canto sei do principiño???

quiz

Worksheet

•

12th Grade - University

Política social, inclusión y Estado de bienestar

89 questions

Política social, inclusión y Estado de bienestar

quiz

Worksheet

•

9th Grade - University

SOAL LATIHAN PPPK 2024

95 questions

SOAL LATIHAN PPPK 2024

quiz

Worksheet

•

5th Grade - University

MIEMBROS SUPERIORES

89 questions

MIEMBROS SUPERIORES

quiz

Worksheet

•

University

Winter brake 12/19-1/3

96 questions

Winter brake 12/19-1/3

quiz

Worksheet

•

6th Grade - University

Examen Diagnostico Farma

91 questions

Examen Diagnostico Farma

quiz

Worksheet

•

University

FORMACION

93 questions

FORMACION

quiz

Worksheet

•

University