BBL Week 4

• Applicatie- en mediaontwikkelaar
• MBO
• Studiejaar 2

Kennismakingsronde

• herhaling koppelen css
  
• css selectoren
• Codecademy html module en daarna css
  

Leerdoelen

Wat bedoelen we binnen CSS met een 'selector'?

Op welke drie manieren kunnen we css toepassen op html?

Hoe zorg ik ervoor dat een kopje <h1> in het rood getoond wordt?

1. h1{ color:red; }
2. <h1>color:red;
3. h1.color = red;

Kennismakingsronde

• HTML elementen
• ID - #
  
• Class - .
  

Selectoren

Kennismakingsronde

• Alle html elementen (standaard)

h1{

 color: blue;

 font-size:13pt;

}

div{

  width: 500px;

}

HTML elementen

Kennismakingsronde

<div id="container">

Inhoud komt hier

</div>

#container{

  background-color: grey;

  padding: 10px;

}

id - #

Kennismakingsronde

<div class="menu">

Inhoud komt hier

</div>

.menu{

  background-color: grey;

  color:white;

  font-weight:bold;

}

class -  .

Kennismakingsronde

• Download het bestand 'selectoren.html' van itslearning
• Voer de stappen uit die beschreven zijn in het html document
  

Oefening selectoren

Kennismakingsronde

• HTML
• CSS (https://www.codecademy.com/enrolled/courses/learn-css)
  

Codecademy

Kennismakingsronde

• selectoren

volgend week

• Introductie javascript
  

Terug- en vooruitblik