WorksheetsHTML/CSS 1
Total questions: 50
Worksheet time: 23mins
Quel est le doctype d'un document HTML5 ?
<!DOCTYPE html5>
<!DOCTYPE html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML5.0 Strict//EN">
Quelle est la syntaxe pour déclarer l'encodage des caractères du document en UTF-8 ?
<meta encoding="text/html; charset=utf-8">
<meta charset="text/html; UTF-8">
<meta charset="utf-8">
Quelle balise permet d'indiquer le titre de la page web ?
<title>
<titre>
<titke>
A l'intérieur de quelles autres balises la balise <meta> se trouve-t-elle ?
<body> et </body>
<title> et </title>
<head> et </head>
Laquelle de ces balises est un commentaire ?
<!-- Commentaire -->
<-- Commentaire -->
<!-- Commentaire >
Lequel de ces encodages de fichier est recommandé ?
utf-8
iso-8859-1
windows-1253
Quelle balise délimite une puce au sein d'une liste ?
<ul>
<ol>
<li>
Quel attribut permet d'insérer un lien ?
href
id
title
Quel attribut permet d'indiquer où se trouve l'image à insérer ?
title
src
alt
Le CSS sert à
faire du style
faire des site internet
dessiner
programmer des jeux en ligne
Pour faire un commentaire en HTML, on utilise les balises
< ! -- commentaires -->
/* commentaires */
% commentaires %
# commentaires #
Pour faire appel à une classe, on utilise en CSS les instructions
.class { .... ;}
#class { .... ;}
/* class { .... ;} */
class { .... ;}
Le sélecteur CSS: p{ color : red;} permet
de colorier les paragraphes en rouge
de colorier les textes du site en rouge
de mettre un fond rouge
de surligner en rouge
La balise <ul> permet
de définir une liste non ordonnée
de définir une liste ordonnée
de définir une suite de paragraphe
souligner du texte
Que signifie HTML ?
Home Tool Markup Language
Happy Text Markup Language
Hyperlinks and Text Markup Language
Hyper Text Markup Language
Quel attribut HTML est utilisé pour spécifier une taille de police?
size
font-size
text-size
font
Quelle est la meilleur manière de faire un menu de site web?
<nav><ul><li><a>
<menu><menuitem><a>
<link><a>
<ol><li><a>
Pourquoi le head est une balise obligatoire?
Il contient des infos essentielles pour le navigateur
Il contient l'entête de mon site dont le menu
Il permet d'afficher le contenu de mon site
Il permet de charger le PHP de ma page
Pourquoi utiliser principalement la balise section dans mon code HTML
Elle permet de diviser mon contenu
Elle permet de séparer des zones qui ont un rôle précis
C'est la seul que l'on peut positionner
Elle est utile pour le référencement
Quel est l'outil pour valider la structure de notre code HTML?
W3C HTML Validator
Visual Studio Code
Le navigateur web avec un afficher la source
La console du navigateur avec la touche FF11
Que représente cette image?
Le box model
Le box sizing
La taille d'un élément
Le CSS d'un élément
Si je veux empêcher l'envoi de mon formulaire HTML en validant la présence d'une valeur dans un champs avec HTML:
Utiliser l'attribut Value
Utiliser l'attribut Required
Utiliser la balise Label
Utiliser la balise Input
Un attribut id permet d'identifier un champ de manière unique au sein d'une page HTML. Qu'est-ce que cela implique ?
Il ne peut pas y avoir plusieurs balises avec un id identique au sein de la page
Il ne peut pas y avoir plusieurs id dans la page
Rien
quel élément permet de créer des liste déroulantes
select
textarea
<input type="text">
<input type="list">
Lesquelles de ces syntaxes sont correctes pour afficher une image ?
<img src="dinosaure.jpg">
<img src="https://www.example.com/images/dinosaure.jpg">
<img src="dinosaur.jpg" alt="image dinosaure">
<img> src="dinosaure.jpg"</img>
à quoi sert alt quand on écrit
<img src="images/dinosaure.jpg"
alt="image dinosaure">
?
Affichier une autre image
Affichier un texte si l'image ne charge pas
Cela n'est pas utile
Qu'est ce que le responsive ?
L'adaptation du site sur plusieurs supports
La réactivité du site
La possibilité d'utiliser le site sur une interface tactile
La règle de style "p.ville { .........} " s'applique :
aux paragraphes <p value="ville">...<p>
aux paragraphes < p> <span "ville">...</span><p>
aux paragraphes <p class="ville">...<p>
ux paragraphes <p id="ville">...<p>
Quelle propriété nous permet de créer des bordures arrondies ?
Border-style
Radius
Raduis-border
Border-radius
Que représente le padding d'un élément ?
Le contenu de l'élément
La marge extérieure
La marge intérieure
La feuille de style
Quelle déclaration permet de supprimer le soulignement d'un élément en CSS ?
underline: none;
text-decoration: none;
text-decoration: underline;
text-decoration: hidden;
Quelle déclaration permet de définir une marge extérieure uniquement en haut et en bas de 10px d'un élément ?
padding: 10px;
padding: 10px 0;
margin: 10px;
margin: 10px 0;
Quel sélecteur ci-après permet de cibler les paragraphes enfant de l'élément id="titi" ?
p#titi {}
#titi p {}
p.titi {}
titi p {}
Lequel des sélecteurs suivants permet de cibler les éléments <p>, <li> et <span> ?
p.li.span { }
p + li + span { }
p, li, span { }
p li span { }
Comment faire pour qu'une div prenne toute la largeur disponible dans son bloc conteneur ?
C'est automatique, pas besoin de spécifier une largeur
div {width: 100%; padding: 10%;}
div {min-width: 100%;}
div {width: 80%; padding: 10%;}
Quelle balise HTML est utilisée pour définir une feuille de style interne ?
<css>
<script>
<style>
<strong>
Quelle est la syntaxe qui permet de relier une feuille de style à une page HTML ?
<link rel="stylesheet" type="text/css" href="style.css" />
<stylesheet/>style.css</stylesheet/>
<style src="style.css"/></style/>
<meta rel="stylesheet" type="text/css" href="style.css" />
Comment peut-on déclarer une flexbox ?
display: flex;
display: flexbox;
display: grid;
display: none;
A l'aide d'une flexbox, quelle propriété permet d'aligner les enfants en colonne ?
flex-direction: row;
flex-direction: column;
flex-direction: none;
Quelle propriété peut on utiliser pour définir une marge externe ?
margin
padding
aucune des deux
Quelle propriété peut on utiliser pour définir une marge interne ?
margin
padding
aucune des deux
Parmi les éléments suivants, quels sont les valeurs de la propriété flex-direction ? (Choisissez toutes les réponses qui s'appliquent.)
auto
column
row-reverse
start
Quel sélecteur CSS est utilisé pour cibler le premier enfant d'un élément ?
:first-child
:first
:first-element
:first-of-type
Quel est l'attribut HTML utilisé pour définir une valeur par défaut dans un champ de formulaire ?
default
initial
value
placeholder
Quelle propriété CSS est utilisée pour ajouter une ombre à un élément ?
shadow
box-shadow
text-shadow
element-shadow
Dans Flexbox, quelle propriété est utilisée pour aligner les éléments enfants le long de l'axe principal ?
align-items
justify-content
align-content
flex-align
Quelle propriété permet d'aligner sur l'axe secondaire dans un conteneur flex ?
align-items
flex-items
wrap-items
axe-secondaire
qu'est qu'un site responsive ?
un site qui s'adapte au différents résolution d'écran
un site doté d'un IA permettant de répondre a l'utilisateur
un site utilisant du javascript
un site utilisant du java
quel élément permet de créer des liste déroulantes
select
textarea
<input type="text">
<input type="list">
pour faire du responsive design on doit
utiliser des unité relative de type % ,vh, em ... pour la mise en page
utiliser des unité absolue de type
px pour la mise en page
