HTML5, CSS3 en JS QUiZ
1 / 20
Lesson duration is: 60 minItems in this lesson
Slide 1 - Slide
This item has no instructions
Wat is HTML?
Slide 2 - Mind map
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 - Quiz
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 - Drag question
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 - Drag question
This item has no instructions
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 - Quiz
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 - Quiz
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.”
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 - Quiz
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 - Quiz
This item has no instructions
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 - Quiz
This item has no instructions
Welke HTML code hoort hierbij?
A
B
C
D
Slide 11 - Quiz
This item has no instructions
Welke HTML code hoort hierbij?
A
B
C
D
Slide 12 - Quiz
This item has no instructions
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 - Quiz
This item has no instructions
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 - Quiz
This item has no instructions
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 - Drag question
This item has no instructions
Welke CSS code heb je nodig?
A
B
C
D
Slide 16 - Quiz
This item has no instructions
Welke CSS code heb je nodig?
A
B
C
D
Slide 17 - Quiz
This item has no instructions
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 - Quiz
This item has no instructions
Wat is een responsieve website?
Slide 19 - Open question
This item has no instructions
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 - Quiz
This item has no instructions
