Theo den Blanken Theo-denBlanken
Theo-denBlanken
/ classAuto.html
Created
December 15, 2019 18:36
Een voorbeeld van een JavaScript class, waarbij 2 instanties uit de Class auto worden gemaakt en gebruikt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="nl"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Test auto Class</title> | |
| <style> | |
| .auto { | |
| width: 2em; | |
| height: 1.5em; | |
| position: absolute; |
Theo-denBlanken
/ thisKnop.html
Created
January 29, 2020 21:28
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>this bij enkele knoppen</title> | |
| </head> | |
| <body> | |
| <h1>Klik op elk van deze knoppen en kijk in de console</h1> | |
| <button>knop EEN</button> <br> | |
| <button>knop TWEE</button> <br> |
Theo-denBlanken
/ nextSibling.html
Created
January 29, 2020 22:44
nextSibling: pas op met text-element tussen mark-up elementen
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Next sibling</title> | |
| </head> | |
| <body> | |
| <h1>Next sibling</h1> | |
| <button id="een">knop 1</button><p>Deze tekst kleuren met een click op knop 1. Tussen deze paragraaf en de knop zit GEEN spatie in de mark-up!</p> |
Theo-denBlanken
/ bootstrapNavigatiebalk.html
Last active
April 15, 2020 20:07
De voorbeeldcode van een navigatiebalk in Bootstrap 4
Theo-denBlanken
/ gridBootstrap.html
Created
April 15, 2020 20:06
Een demo met het grid van Bootstrap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="ne"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <meta name="author" content="Theo den Blanken"> | |
| <title>navigatiebalk</title> | |
| <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> | |
| </head> | |
| <body> |
Theo-denBlanken
/ variabelenVoorbeeld.scss
Last active
April 22, 2020 20:18
Een voorbeeld van variabelen in SCSS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Dit is commentaar met dubbele slash | |
| // hier maken we variabelen. | |
| /* Dit is meer css-commentaar */ | |
| $lettertype: Helvetica, sans-serif; | |
| $primaire-kleur: rgb(27, 116, 240); | |
| body { | |
| font: 100% $lettertype; | |
| color: $primaire-kleur; |
Theo-denBlanken
/ varsGecompileerd.css
Last active
April 23, 2020 05:14
De CSS die gecompileerd is uit de SCSS 'variabelenVoorbeeld.scss'
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Dit is meer css-commentaar */ | |
| body { | |
| font: 100% Helvetica, sans-serif; | |
| color: #1b74f0; | |
| } | |
| /*# sourceMappingURL=style.css.map */ |
Theo-denBlanken
/ variabelenVoorbeeld.sass
Created
April 23, 2020 05:17
Hetzelfde voorbeeld als 'variabelenVoorbeeld.scss' maar nu als .sass
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Dit is commentaar met dubbele slash | |
| // hier maken we variabelen | |
| /* Dit is meer css-commentaar */ | |
| $lettertype: Helvetica, sans-serif | |
| $primaire-kleur: rgb(27, 116, 240) | |
| body | |
| font: 100% $lettertype | |
| color: $primaire-kleur |
Theo-denBlanken
/ nestingVoorbeeld.scss
Created
April 23, 2020 05:38
Een voorbeeld van nesting in sass
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Nesting met SCSS | |
| $primair: cornflowerblue; | |
| .navigatie { | |
| background-color: $primair; | |
| li { | |
| float: left; | |
| } | |
| a { | |
| display: block; |
Theo-denBlanken
/ nestingVoorbeeld.sass
Created
April 23, 2020 05:41
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Nesting met SCSS | |
| $primair: cornflowerblue | |
| .navigatie | |
| background-color: $primair | |
| li | |
| float: left | |
| a | |
| display: block | |
| padding: 1em 2em |
OlderNewer