Built with blockbuilder.org
forked from molliemarie's block: BartCHart1_HTML_Starter
license: mit |
Built with blockbuilder.org
forked from molliemarie's block: BartCHart1_HTML_Starter
<!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: purple; | |
} | |
svg { | |
border: 1px solid #f0f; | |
} | |
</style> | |
</head> | |
<body> | |
<!-- 1) Make a container `<div>` in which you'll render your content --> | |
<!-- 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>`--> | |
<div> | |
<p> My Bar Chart </p> | |
<svg width=300 height=400> | |
<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> | |
</div> | |
</body> | |
</html> |