Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een...

7
Basis HTML

Transcript of Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een...

Page 1: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

Basis HTML

Page 2: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

CSS

Inline styles - in de body

Interne stylesheet – in de head

Externe stylesheet – in een extern bestand

Page 3: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

WAT ZIJN INLINE STYLES?

Inline styles worden in de HTML-code geschreven. Je vindt ze in de body als attribuut van een HTML-tag.

Bijvoorbeeld:

Zonder inline style: <h1>Dit is een kop</h>

Met inline style: <h1 style=“font-family: verdana;”>Dit is een kop met als lettertype Verdana</h1>

Met een lijstje inline styles: <h1 style=“font-family: verdana; font-size:18pt; color: blue;”>Dit is een kop</h1>

Page 4: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

CODEVOORBEELD MET INLINE STYLES

Page 5: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

ZELF PROBEREN

Voorbeelden van code en hoe dit er uitziet in een browser.

Links voor hulp:

• Over CSS

• Over div en span

Deze pagina staat oop in het zip-bestand.

Page 6: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

De opdracht voor week 3

De Opdracht:

Maak een pagina waarin twee producten wordenaangeboden.

Hiernaast zie je een ‘lege’ pagina die je kunt gebruiken alsbeginnetje.

In het zip-bestand (link) vind je deze pagina en de andere hulp-bestanden.

Page 7: Basis HTML · 2019-01-23 · ZELF PROBEREN Voorbeelden van code en hoe dit er uitziet in een browser. Links voor hulp: • Over CSS • Over div en span Deze pagina staat oop in het

De opdracht voor week 3

Hiernaast zie je een voorbeeldvan een opgemaakte pagina.

De producten hoeven niet per sénaast elkaar. Ze mogen ookonder elkaar staan.

In bron van deze pagina kan je voorbeelden van code vinden.