What is LessonUp
Search
Channels
Log in
Register
‹
Return to search
CSS review - HWUD04 20:21
& CSS
1 / 26
next
Slide 1:
Slide
Communication & multimedia design
HBO
Studiejaar 2
This lesson contains
26 slides
, with
interactive quizzes
and
text slides
.
Lesson duration is:
15 min
Start lesson
Save
Share
Print lesson
Items in this lesson
& CSS
Slide 1 - Slide
Hoeveel ECTS krijg je voor HWUD04?
A
2 ECTS
B
3 ECTS
C
4 ECTS
D
5 ECTS
Slide 2 - Quiz
Hoeveel uur moet je dus aan HWUD04 werken?
A
22 uur
B
56 uur
C
84 uur
D
112 uur
Slide 3 - Quiz
22-28 uur is ingepland
84 uur is zelfstudie / huiswerk
Slide 4 - Slide
Slide 5 - Slide
Hoe selecteer je in CSS het element met ID="webform"
A
.webform (punt)
B
webform (niets)
C
#webform (hashtag)
D
gebruik de muis
Slide 6 - Quiz
Je wil tekst in een paragraaf een andere kleur geven. Welke tag gebruik je?
A
<div>
B
<span>
C
<nav>
D
<main>
Slide 7 - Quiz
je wil een kolom maken op je webpagina. Welke tag gebruik je?
A
<span>
B
<div>
C
<header>
D
<section>
Slide 8 - Quiz
Je wil de afstand tussen elementen aanpassen hoe doe je dat?
A
padding: 25px
B
distance: 25px
C
border: 25px
D
margin: 25px
Slide 9 - Quiz
Je wil aan de bovenkant meer afstand tussen de inhoud en de rand van een div. Hoe doe je dat?
A
padding-top: 2em
B
padding: 2em 0em 0em 0em
C
margin-top: 2em
D
margin: 2em 0em
Slide 10 - Quiz
Wat gebeurt hier?
div {margin: 0 auto}
A
De marge wordt aangepast aan het beeldscherm
B
de div wordt gecentreerd
C
De vertikale marge is 0
D
alle marges worden gereset
Slide 11 - Quiz
wat gebeurt hier?
li {padding: 0px 5px 25px 50px}
Slide 12 - Open question
Maak een tabel
<table>
HTML & Tekst
</table>
<td>
</td>
<tr>
</tr>
Slide 13 - Drag question
HTML tabellen
Vroeger maakten we layouts met tabellen. Nu is dat NOT DONE!
Koppen boven tabellen maak je met <th>
Rijen: <tr> cellen: <td>
zie ook
W3schools
Slide 14 - Slide
Schrijf CSS om een zwarte rand van 1px om elke tabel-cel te plaatsen
Slide 15 - Open question
Wat gebeurt hier?
<ol><li>tekst</li></ol>
A
Je krijgt een kop met scheve tekst
B
Genummerde lijst: 1. tekst
C
je krijgt een link
D
Je krijgt een lijst: • tekst
Slide 16 - Quiz
Ordered vs Unordered lists
Ordered Lists - tellen met ABC, I. II. III., abc, 123
Unordered lists - • - ‣ ➢
Zie
W3schools
of
Javatpoint
Slide 17 - Slide
Waar kan CSS allemaal voorkomen in een HTML-document?
Slide 18 - Open question
<div
="uniekenaam"
="groepblauw">
<div
="naam2"
="groepblauw"
ID
Class
Slide 19 - Drag question
Hoe selecteer je in CSS het element met Class="menu"
A
.menu (punt)
B
menu (niets)
C
#menu (hashtag)
D
$menu
Slide 20 - Quiz
wat is Precedence in CSS?
Slide 21 - Open question
Welke kleur wordt de div?
<style>div {color: pink}</style>
...
<div style="color: green; color: blue">
A
pink
B
green
C
blue
D
black
Slide 22 - Quiz
Welke kleur wordt de tekst van de div?
<style>div {color: pink! important; color: yellow}</style>
...
<div style="color: green; color: blue">
A
pink
B
green
C
blue
D
black
Slide 23 - Quiz
In een linked-css-document staat:
a:hover {color: blue}
in het document staat in de head:
<style>a:hover {color: green}</style>
wat wordt het?
A
blue
B
green
C
black
D
solid
Slide 24 - Quiz
<style> div {color: green}
.klasse {color: yellow}
#ideetje {color: pink} </style>
...
<div id="ideetje" class="klasse">welke kleur word ik?</div>
A
Green
B
Yellow
C
Pink
D
Black
Slide 25 - Quiz
Precedence
Hoe preciezer je de selector definieert, des te meer precedence.
Tags zijn vaag.
Klasses zijn beter
ID's zijn super precies
Slide 26 - Slide
More lessons like this
HWUD04-sj2122-L2-CSS
February 2022
- Lesson with
22 slides
Communication & multimedia design
HBO
Studiejaar 2
HTML - Tags
March 2021
- Lesson with
30 slides
Communication & multimedia design
HBO
Studiejaar 1
Webdesign - Les 2 (22/23)
November 2022
- Lesson with
30 slides
Informatica
Middelbare school
havo, vwo
Leerjaar 4
HWUD04-sj2122-03-HTML-document
February 2021
- Lesson with
31 slides
Communication & multimedia design
HBO
Studiejaar 2
HTML & CSS 03 - 3.3 tmt 3.6 - Lijsten, tabellen, embedden
September 2023
- Lesson with
27 slides
Informatica
WO
Studiejaar 4,5
bkup 03-HTML-document
December 2021
- Lesson with
37 slides
Communication & multimedia design
HBO
Studiejaar 2
Webdesign - Les 2 (23/24): Links
September 2023
- Lesson with
25 slides
Informatica
Middelbare school
havo, vwo
Leerjaar 4
HTML & CSS 90 - herhaling
June 2023
- Lesson with
33 slides
Informatica
Middelbare school
havo, vwo
Leerjaar 4,5