CSS en de chrome devtools

Je kan eigenschappen van html elementen aanpassen met css
Je weet hoe je de chrome inspector kan gebruiken om te "spieken" bij andere websites

1 / 11

Slide 1: Slide

InformaticaMiddelbare schoolvwoLeerjaar 4

This lesson contains 11 slides, with interactive quizzes and text slides.

Items in this lesson

Je kan eigenschappen van html elementen aanpassen met css
Je weet hoe je de chrome inspector kan gebruiken om te "spieken" bij andere websites

Slide 1 - Slide

Vrijdag

Ben ik er niet
Maar kunnen jullie zelfstandig aan de slag
Daarover einde van de les meer..

Slide 2 - Slide

Basis van een website

<HTML>

tekst

</HTML>

.CSS {

opmaak

}

Javascript(){

gedrag;

}

Slide 3 - Slide

CSS: Cascading StyleSheet

Eigenschappen van html elementen aanpassen
Opmaak toevoegen aan html elementen

Slide 4 - Slide

https://codepen.io/timmiekun/pen/YRaNjy

Selectors

https://htmldog.com/guides/css/beginner/selectors/

Slide 5 - Slide

Slide 6 - Slide

Chrome devtools

Open chrome
Ga naar nos.nl
Druk op F12 of..
Rechtermuisknop -> inspect element

Slide 7 - Slide

Aan de slag

css basis in classroom

Slide 8 - Slide

Gedrag

Opmaak

Data

Beheer

Slide 9 - Drag question

Wat kon er beter aan deze les?

Slide 10 - Open question

Vriend en vijand van elke developer: browsers!

Slide 11 - Slide

CSS en de chrome devtools

Items in this lesson

Slide 1 - Slide

Slide 2 - Slide

Slide 3 - Slide

Slide 4 - Slide

Slide 5 - Slide

Slide 6 - Slide

Slide 7 - Slide

Slide 8 - Slide

Slide 9 - Drag question

Slide 10 - Open question

Slide 11 - Slide

More lessons like this

CSS - selectors

CSS - gebruik maken van classes

HTML en CSS - les 2 - wat is css?

HTML en CSS - document flow en box model

HTML en CSS - gebruik maken van classes

CSS - inspecteren en aanpassen

Les4 - CSS Selectoren: HTML Elementen Aanspreken

HTML en CSS 3 - selectors