HTML5, CSS3 en JS QUiZ

HTML5, CSS3 en JS Quiz
Doel: Opfrissen van kennis na de kerstvakantie.
20 vragen in 1 lesuur
1 / 20
volgende
Slide 1: Tekstslide
InformaticaMiddelbare schoolvwoLeerjaar 4

In deze les zitten 20 slides, met interactieve quizzen en tekstslide.

time-iconLesduur is: 60 min

Onderdelen in deze les

HTML5, CSS3 en JS Quiz
Doel: Opfrissen van kennis na de kerstvakantie.
20 vragen in 1 lesuur

Slide 1 - Tekstslide

Deze slide heeft geen instructies

Wat is HTML?

Slide 2 - Woordweb

HTML is een opmaaktaal voor de specificatie van documenten, voornamelijk bedoeld voor het wereldwijde web. Het is de standaard opmaaktaal voor webpagina's.

Documenten in HTML kunnen geopend en gelezen worden door een webbrowser om vervolgens als webpagina weergegeven te worden.

Waar staat de afkorting HTML voor?
A
Header Text Manual Language
B
Head Tag Manual Language
C
Hyper Text Markup Language
D
Hyperlink Tag Markup Language

Slide 3 - Quizvraag

HTML is de afkorting van HyperText Markup Language. Met HyperText wordt tekst bedoeldmet directe verwijzingen in de vorm van aanklikbare links. Je hoeft dus niet meer via een indexte zoeken maar kunt rechtstreeks van de ene pagina naar de andere springen. Markup betekentdat de taal uit markingstekens bestaat waarmee je aangeeft hoe de tekst opgemaakt moet wor-den.

      Sleep de begrippen naar het juiste doel.
HTML
CSS
Javascript
Opmaak
Kleuren
Structuur webpagina
Gedrag webpagina
Notepad++
Documenten

Slide 4 - Sleepvraag

Notepad++ is een editor en behoort niet specifiek tot 1 van de doelen. Documenten is een algemeen begrip en kunnen betrekking hebben op HTML, CSS of JS document maar zijn niet specifiek aan een doel te koppelen.
Sleep de code voorbeelden naar het juiste doel.
 -HTML, CSS, JS-.
HTML
CSS
JS

Slide 5 - Sleepvraag

Deze slide heeft geen instructies


CCS is een afkorting voor Cascading Style sheets.
De CSS-informatie voor de vormgeving van het document wordt toegevoegd aan de HTML-code.
Welke manier hoort er niet bij?
A
Inline
B
External
C
Extern
D
Internal

Slide 6 - Quizvraag

De CSS-informatie voor de vormgeving van het document wordt toegevoegd aan de HTML-code ervan. Die informatie mag in het HTML-bestand zelf staan, maar ook in een apart bestand waar het HTML-document naar verwijst. Een dergelijk extern bestand wordt ook wel stylesheet genoemd.
Waarom plaats je meerdere video formaten?
A
Meerdere browsers - als IE9, Chrome, Firefox, Safari - kunnen de video nu afspelen.
B
Door meerdere sources te combineren verkrijg je een hogere kwaliteit video.
C
Als het eerste bestand .mp4 niet werkt dan wordt automatisch het tweede bestand aangeroepen .ogg.
D
Browsers kunnen nu kiezen welk source type ze afspelen om de beste kwaliteit te brengen.

Slide 7 - Quizvraag

Internet Explorer 9 en safari zullen de bovenste afspelen: lmfho.mp4 omdat
deze browsers mp4 ondersteunen.
Firefox, chrome en Opera zien de eerste regel ook. Deze browsers kunnen
hier niets mee dus geven deze regel ook niet weer. De tweede regel met
lmfho.ogg kunnen ze wel weergeven dus dat doen ze ook.
Internet explorer 8 en lager kunnen zowel de eerste als de tweede regels niet
weergeven. Wel de derde regel wat gewoon tekst is. In internet explorer 8 zul
je dan de regel zien:
“De browser die je nu gebruikt ondersteunt nog geen video.”
Welk element is geen nieuw HTML5 element?
A
<nav>
B
<header>
C
<article>
D
<head>

Slide 8 - Quizvraag

In HTML 4.01 de <head> element is vereist.

In HTML5 kan zelfs de <head> element weggelaten worden.

Let op: <head> bevat meta informatie over de site en is niet zichtbaar. De <header> kan op diverse plaatsen binnen de <body> opgenomen worden en is zichtbaar op de webpagina.

Welke HTML code hoort hierbij?
A
<h3>Header tekst</h3> <p>alinea 1</p> <p>alinea 2<br><em>schuin</em></p>
B
<h1>Header tekst</h1> <p><b>alinea 1</b></p> <p>alinea 2<em>schuin</em></p>
C
<h1>Header tekst</h1> <p><b>alinea 1</b></p> <p>alinea 2<br><em>schuin</em></p>
D
<h1>Header tekst</h1> <p><b>alinea 1</b></p> <p>alinea 2<br>schuin</p>

Slide 9 - Quizvraag

Deze slide heeft geen instructies


Welke HTML code hoort hierbij?
A
<href="afbeelding.html"><a>Klik hier</a> om naar de webpagina te gaan.
B
<a="afbeelding.html">Klik hier</a> om naar de webpagina te gaan.
C
<a href="afbeelding.html">Klik hier om </a> naar de webpagina te gaan.
D
<a href="afbeelding.html">Klik hier</a> om naar de webpagina te gaan.

Slide 10 - Quizvraag

Deze slide heeft geen instructies


Welke HTML code hoort hierbij?
A
B
C
D

Slide 11 - Quizvraag

Deze slide heeft geen instructies


Welke HTML code hoort hierbij?
A
B
C
D

Slide 12 - Quizvraag

Deze slide heeft geen instructies



Mag je
meerdere CSS bestanden koppelen?
A
Nee, er mag maar 1 CSS bestand gekoppeld zijn.
B
Ja, er mogen 2 CSS bestanden gekoppeld zijn.
C
Ja, er mogen meerdere CSS bestanden gekoppeld zijn.
D
Ja, er mogen maximaal 5 CSS bestanden gekoppeld zijn.

Slide 13 - Quizvraag

Deze slide heeft geen instructies


Wat voor CSS code
heb ik nodig om de af-beelding tegen de border (rand) te zetten?
A
{padding: 0 0 0 0;}
B
{margin: 0 0 0 0;}
C
{border: 0 0 0 0;}
D
{padding: 10px 0 10px 50px;}

Slide 14 - Quizvraag

Deze slide heeft geen instructies

Sleep de elementen naar het juiste doel.
Blockelementen hebben allemaal een eigen marge, border en padding en komen standaard onder elkaar op een pagina te staan.
Inline elementen kun je midden in de tekst zetten. De tekst loopt dan vloeiend door. Inline elementen komen standaard naast elkaar te staan.
Block elementen
Inline elementen
<table>
<em>
<h1>
<h2> <h3>
<ul>
<ol>
<strong>
<abr>
<header>
<nav>
<p>
<span>

Slide 15 - Sleepvraag

Deze slide heeft geen instructies




Welke CSS code heb je nodig?
A
B
C
D

Slide 16 - Quizvraag

Deze slide heeft geen instructies




Welke CSS code heb je nodig?
A
B
C
D

Slide 17 - Quizvraag

Deze slide heeft geen instructies



Wat doet deze CSS code?
A
De afmetingen van enkele box elementen worden berekend als volgt: width = border + padding + breedte van de inhoud en height = border + padding + hoogte van de inhoud.
B
De afmetingen van alle box elementen worden berekend als volgt: width = padding + breedte van de inhoud en height = padding + hoogte van de inhoud.
C
De afmetingen van alle box elementen worden berekend als volgt: width = border + padding + breedte van de inhoud en height = border + padding + hoogte van de inhoud.
D
De afmetingen van alle box elementen worden berekend als volgt: width = border + breedte van de inhoud en height = border + hoogte van de inhoud.

Slide 18 - Quizvraag

Deze slide heeft geen instructies

Wat is een responsieve website?

Slide 19 - Open vraag

Deze slide heeft geen instructies


Wat betekent deze code in het CSS bestand?
A
Bij een schermbreedte van 700 pixels verschijnen de elementen nav en article onder elkaar over de gehele breedte van het scherm.
B
Bij een schermhoogte kleiner of gelijk aan 600 pixels verschijnen de elementen nav en article naast elkaar over de gehele breedte van het scherm.
C
Bij een schermhoogte kleiner dan 600 pixels verschijnen de elementen nav en article naast elkaar over de gehele breedte van het scherm.
D
Bij een schermbreedte kleiner of gelijk aan 600 pixels verschijnen de elementen nav en article onder elkaar over de gehele breedte van het scherm.

Slide 20 - Quizvraag

Deze slide heeft geen instructies