Built with blockbuilder.org
forked from molliemarie's block: BartCHart1_HTML_Starter
Last active
February 7, 2020 20:43
-
-
Save lauriemerrell/bc28ed5c44361be82bc9e8586044fa2b to your computer and use it in GitHub Desktop.
BartCHart1_HTML_Starter
This file contains hidden or 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
| license: mit |
This file contains hidden or 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> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>First Bar Chart Using HTML!</title> | |
| <style> | |
| /* 5) Set `rect` elements to have a "fill" of "purple" or whatever color you choose */ | |
| rect { | |
| fill: pink; | |
| } | |
| svg { | |
| border: 1px solid #f0f; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- 1) Make a container `<div>` in which you'll render your content --> | |
| <div> | |
| <p> | |
| My Bart Chart | |
| <br> | |
| <svg> | |
| <rect x=0 y=10 width = 100 height =20></rect> | |
| <rect x=0 y=40 width = 200 height =20></rect> | |
| <rect x=0 y=70 width = 300 height =20></rect> | |
| </svg> | |
| </p> | |
| </div> | |
| <!-- 2) Create a `<p>` element in which you write "My Bar Chart" --> | |
| <!-- 3) Make a container `<svg>` element in which you'll place your rectangles --> | |
| <!-- 4) Put 3 `<rect>` inside of your `<svg>`--> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment