wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Quiz-Sprint1,2,3

Total questions: 62

Worksheet time: 49mins

Name
Class
Date
1.

Les fondamentaux du HTML est connu sous le nom de ___________.

a)

HTML Body

b)

HTML Tag

c)

HTML element

d)

HTML Attribute

2.

Toutes les balises HTML sont entourées de ____________

a)

# and #

b)

{ and }

c)

? and !

d)

< and >

3.

Comment écrire un commentaire en HTML

4 lines
4.

Lequel des codes suivants créerait une ligne horizontale en HTML ?

a)

<br />

b)

<hr>

c)

<hb>

d)

<tr>

5.

Parmi les balises suivantes lesquelles sont des balises sémantiques ?

a)

<article>

b)

<section>

c)

<form>

d)

<address>

e)

<div>

6.

Quelle est la fonction de la balise <p> ?

a)

Définit un paragraphe.

b)

colorier un texte

c)

joindre un texte

d)

afficher une page

7.

Lequel des éléments suivants n'est PAS une fonction de l'élément <title> </title> ?

a)

Définir un titre dans le browser

b)

Ajouter un titre à la page dans les indexs

c)

Création du premier titre de votre page index

d)

Afficher le titre dans les moteurs d'indexations

8.

Les scripts peuvent être placés n'importe où dans un document HTML.

a)

Yes

b)

No

9.

Choisissez la balise correcte pour le plus grand titre :

a)

h6

b)

heading

c)

head

d)

h1

10.

Qu'adviendra-t-il du texte en bleu ? <p>Il a utilisé sa voiture <i>Audi</i>, car elle était très rapide.

a)

le contenu sera affiché en italique

b)

le contenu sera affiché comme une icone

c)

le contenu affichera une image

d)

le contenu définit le texte inséré dans un document

e)

Aucune de ces réponses

11.

Quel code rendra votre fond d'écran en rouge ?

a)

<body colormybg="background-color:red;">

b)

body{background-color:red}

c)

<body style="background-color:red;">

d)

<body style="background-color:yellow;">

12.

Ecrivez un code HTML permettant de créer un tableau de 3 lignes et deux colonnes

4 lines
13.

Que contient <head> </head>du code HTML ?

a)

Toutes les commandes

b)

les données à afficher

c)

Toutes les instructions d'une page web

d)

les informations qui ne sont pas affichées

14.

CSS signifie ?

a)

Code style sheet

b)

Cascading style sheet

c)

Cascading sheet style

d)

Cascading sass sheet

15.

Quelle est la syntaxe CSS correcte ?

a)

body {color: yellow;}

b)

{body:color= yellow;}

c)

body:color=yellow;

d)

{body;color: yellow;}

16.

Si vous avez besoin d'espace au-dessus de la balise div, quelle estla propriété CSS pour augmenter l'espace en dessus ? (Choisissez la syntaxe correcte)

a)

margin-top: 20px;

b)

padding-top:20px

c)

margin:20px 0 0 0;

d)

margin:20px 0

17.

Si nous voulons définir le style d'un élément unique, quel sélecteur css utiliserons-nous ?

a)

class

b)

id

c)

tag

d)

name

18.

Comment je peux ajouter un style hover sur un button afin de changer son apparence : <button class="btn">Click </button> ? changer la couleur du text en vert et la couleur du background en bleu

4 lines
19.

Si nous voulons utiliser une bordure verte en pointillés autour d'une image, quelle propriété css allons-nous utiliser ?

a)

border-color

b)

border-line

c)

border-style

d)

border-decoration

20.

Peut-on aligner un élément du bloc en définissant les marges gauche et droite ?

a)

OUI

b)

NON

21.

Quelle doit être la largeur d'un élément en bloc <div></div>, de sorte que la largeur de la div s'adapte à la largeur actuelle de la fenêtre du navigateur.

a)

600px

b)

100%

c)

100wh

d)

1024px

22.

Quelle propriété css utiliserez-vous si vous voulez ajouter une marge entre la bordure d'un DIV et son texte intérieur ?

a)

margin

b)

padding

c)

font-size

d)

transform

23.

Par défaut, les hyperliens sont affichés avec un soulignement. Comment supprimer le soulignement de tous les hyperliens à l'aide du code CSS ?

4 lines
24.

L'utilisation du Responsive Web Design (RWD) garantit que le site s'affichera correctement sur tous les navigateurs de bureau et les appareils mobiles.

Vous avez utilisé une mise en page basée sur une grille et des images redimensionnables. Quelle est une autre technique RWD que vous pouvez utiliser dans le cadre du responsive design ?

a)

Use static pixels for all content positioning

b)

Utilisez des unités relatives, telles que des pourcentages, pour le positionnement des éléments de la page.

c)

Utilisez des éléments de structure de page standard, notamment <header>, <footer> et <article>, car les appareils plus anciens afficheront correctement le contenu des éléments de structure.

d)

Utilisez des polices de caractères plus petites pour tout le corps du texte, afin de garantir qu'il s'affiche correctement sur les écrans plus petits

25.

Quel est le problème avec ce code

4 lines
26.

Que fait le style position:fixed pour styliser une image ?

a)

Place une image en fonction de la position de défilement de l'utilisateur.

b)

Épingle une image à un endroit précis de la fenêtre du navigateur, même lorsque l'utilisateur fait défiler le contenu de la page.

c)

Dimensionne une image à une taille fixe, quelle que soit la taille du navigateur de l'utilisateur.

d)

Place une image à un endroit précis de la page par rapport au texte qui la précède.

27.

Quel modèle comprend la marge, la bordure, le rembourrage et le contenu ?

a)

CSS Box model

b)

CSS3 Grid Layout model

c)

CSS Grid Template Layout Module

d)

CSS3 Flexbox Box model

28.

La propriété CSS display:flex définit le flexbox comme _____element.

a)

un bloc

b)

un élément invisible

c)

un élément inline

d)

Néant

29.

Parmi les éléments suivants, quels sont les valeurs de la propriété flex-direction ? (Choisissez toutes les réponses qui s'appliquent.)

a)

auto

b)

column

c)

row-reverse

d)

start

30.

Combien de colonnes et de lignes sont définies dans le code suivant ?


section {

display: grid;

grid-columns: 100px 1fr 250px;

grid-rows: 50px 1fr 50px;

}


section header {

grid-column: 2;

grid-row: 1;

}


section nav {

grid-column: 1;

grid-row: 2;

}


section article {

grid-column: 2;

grid-row: 2;

}


section aside {

grid-column: 3;

grid-row: 2;

}


section footer {

grid-column: 2;

grid-row: 3;

}

a)

3 rows and 3 columns

b)

2 rows and 3 columns

c)

3 rows and 2 columns

d)

1 row and 1 column

31.

Vous créez un modèle de mise en page en grille. Par quoi remplacez-vous le mot TEXTE dans le code suivant si vous voulez que tout le contenu apparaisse dans la grille ?


div { grid-template: "TEXT"; grid-rows: auto; grid-columns: auto;}


eeney { grid-position: a; }

meeney { grid-position: b; }

miny { grid-position: c; }

moe { grid-position: d; }

a)

abcd

b)

grid-position

c)

all

d)

eeney meeney miny moe

32.

Quelle propriété oblige les éléments flex à s'afficher à la ligne de base de leur conteneur ?

a)

align-items: flex-end

b)

align-items:flex-start

c)

justify-content:flex-start

33.

Comment centrer vos éléments flex le long de l'axe principal soit (X,Y) ? en supposant qu'on a un container avec un display flex et une direction row

4 lines
34.

Laquelle des méthodes suivantes est correcte pour définir le ViewPort ?

a)

<meta name="viewport" content="width=device-width, initial-scale=1.0">

b)

absolute

c)

none

35.

justify-content vous permet de faire quoi ?

a)

définir la direction du positionnement des éléments en fonction de la ligne ou de la colonne.

b)

définir comment positionner les éléments verticalement

c)

définit comment positionner les éléments horizontalement

d)

définir comment les éléments seront enveloppés lorsque la largeur du navigateur est modifiée

36.

let a = 10;

let b = 3;


a = (a/b) + 2;


Quelle est la valeur de a ?

a)

3

b)

5

c)

5.3

d)

3.3

37.

let a = 0;

let val1 = 10

let val2 = 6;


if (val1 < val2)

{

a+= val2;

}


else if(val2 > val1)

{

a+= 0;

}


else

{


a = val1;

}


Quelle est la valeur de a

a)

10

b)

-1

c)

0

d)

2

38.

leta1 = 2;

3 = a1;

Expliquez en quelques lignes l'erreur engendré

4 lines
39.

function g ( x, y) {


x = x + y;

let z = - y + x * 2;

return z;

}


quelle sera le résultat de l'appel de la fonction g(4,-10)

a)

10

b)

-1

c)

-2

d)

18

40.

function f ( x, y) {

if (x + 2 < y) {

x = x + 3;

return y * x;

}

else {

return x + y + 2;

}

}

quelle est le résultat de retour de l'appel de la fonction f(3,2)

a)

7

b)

3

c)

2

d)

8

41.

function f (n) {


let ans = 0;

for (let i = 1; i < n; i++) {

if (i < n/2) {

ans -= i;

}

else {

ans += i;

}

}

return ans;

}


Donnez le résultat de retour de la fonction suivante : f(5)

4 lines
42.

let x = 6;

console.log(-3 < 5 && !(x % 3 == 0))


cette instruction est elle ?

a)

true

b)

false

43.

let x = 4;

let y;

let z;


y=--x;

z = x--;

console.log(x,y,z);


Qu'est ce que le programme va afficher ?

a)

2 3 3

b)

4 3 3

c)

3 2 3

d)

2 3 2

44.

function main()

{


let a=25;


while(a <= 27)

{

console.log(a);

a++;

}

}


La fonction suivante affichera quoi comme résultat ?

a)

25 26 27

b)

25 25 26

c)

27 27 27

d)

none of the above

45.

function main(){

let a=32;

do

{

console.log(a);

a++;

}


while(a <= 30);

console.log(a);

}


Résultat de la fonction ?

a)

32 32

b)

33 33

c)

32 33

d)

undefined

46.

Parmi les choix suivant ? quelles sont les méthodes qu'on peut utiliser sur des types de donnée Array ?

a)

map

b)

reduce

c)

split

d)

slice

47.

Comment changer le premier élément d'un tableau ?

a)

nums[1] = "New!";

b)

var nums[1] = "New!";

c)

nums = "New!";

d)

nums[0] = "New!";

48.

Laquelle des méthodes JavaScript suivantes êtes-vous le plus susceptible d'utiliser pour activer un bouton?

a)

onClick

b)

onLoad

c)

onMouseover

d)

whenClick

49.

Expliquer en quelques lignes la différence entre une fonction de déclaration et une fonction expression (normal function and arrow function)

4 lines
50.

const divs = document.querySelectorAll('div');

console.log(divs)

Quelle est le type de data retournée ?

a)

nodeList

b)

HtmlCollection

c)

HtmlList

d)

nodeCollection

51.

Expliquez en quelques lignes, le fonctionnement asynchrone en javascript ?

4 lines
52.

Sélectionnez les bibliothèques de JavaScript parmi les choix suivants

a)

REACT JS

b)

PROMISES

c)

JQUERY

d)

BOOTSTRAP

53.

Quelle méthode intégrée renvoie les caractères d'une chaîne commençant d'un emplacement spécifié ?

a)

substr()

b)

slice()

c)

get()

d)

toUpperCase()

54.

Laquelle des fonctions suivantes de l'objet Array ajoute un ou plusieurs éléments à la fin d'un tableau et renvoie la nouvelle longueur du tableau ?

a)

push()

b)

pop()

c)

shift()

d)

unshift()

55.

Ecrivez un programme en javascript qui te permet de calculer le factorielle d'un nombre saisi au clavier ?

factorielle du nombre 4 est 1*2*3*4

4 lines
56.

Quelles sont les variables par défaut définie par REACT

a)

props

b)

state

c)

effects

d)

refs

57.

Dans react html est appelé .....?

a)

JSF

b)

JSX

c)

REACT HTML

d)

DOM

58.

...... aide REACT à transiter les données entre les composants

a)

state

b)

props

c)

Virtual DOM

d)

none

59.

Citez les trois états d'un cycle de vie d'un composant ?

4 lines
60.

Un Hook de type UseEffect() ? quelle est sa particularité par rapport au cycle de vie d'un composant ?

a)

Re render le composant

b)

Enregistrer les datas après le rendering d'un composant

c)

Trigger le rendering

d)

none of the above

61.

Parmi les fonctions suivantes, lesquelles sont utilisé pour interroger une API ?

a)

fetch

b)

XmlHttpRequest

c)

axios

d)

HtmlRequest

62.

Supposons que j'ai l'objet suivant : const obj = {name:'amine',age:'hamid'} que fait la fonction Object.values(obj)

4 lines