4.1 bootstrap intro

236 views
220 views

Published on

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
236
On SlideShare
0
From Embeds
0
Number of Embeds
176
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

4.1 bootstrap intro

  1. 1. Javascript module 4 HTML-CSS-JS 4.1 Bootstrap Intro Module 4 html/css /JS
  2. 2. Wat is Bootstrap ? Module 4 4.1 Bootstrap Intro • Reponsive design Framework • Te gebruiken voor statische websites • Te gebruiken voor dynamisch web applicatie • Populair bij back-end en front-end developers • Te combineren met cms en php etc… • Eenvoudig te gebruiken
  3. 3. Voorbeelden ? Module 4 4.1 Bootstrap Intro Buildwithbootstrap.com Lovebootstrap.com
  4. 4. Bootstrap download ! Module 4 4.1 Bootstrap Intro
  5. 5. Bootstrap download ! Module 4 4.1 Bootstrap Intro • Bootstrap downloaden • Informatie over bootstrap • Customize informatie • Bootstrap documentatie Wat vind je op de site?
  6. 6. Bootstrap downloaden ! Module 4 4.1 Bootstrap Intro Klik
  7. 7. Module 4 4.1 Bootstrap Intro Bootstrap downloaden ! Kies voor de minified versie En klik op download
  8. 8. Module 4 4.1 Bootstrap Intro Bootstrap downloaden ! Pak het geheel uit en plaatst het in een map 4.1 Bootstrap Info
  9. 9. Module 4 4.1 Bootstrap Intro css Grid options!
  10. 10. Module 4 4.1 Bootstrap Intro index.html maken! Koppelingen naar bootstrap bestanden
  11. 11. Module 4 4.1 Bootstrap Intro 1e stappen bovenkant website met bootstrap. 2 kolommen voor Schermen groter of gelijk aan 1200px
  12. 12. Module 4 4.1 Bootstrap Intro 2e class toevoegen voor andere device col-lg- Col-sm-
  13. 13. Module 4 4.1 Bootstrap Intro 3e class toevoegen voor mobile device col-lg- Col-sm- Col-xs-
  14. 14. Module 4 4.1 Bootstrap Intro Opdracht We gaan tijdens deze module een zakelijke website bouwen met behulp van Bootstrap. De website is voor jezelf en te gebruiken als portfolio. De volgende zaken moeten opgeleverd worden: • Logo • Slogan • Webpagina met logo en slogan d.m.v. bootstrap geschikt voor meerdere devices (2 kollomen)

×