mkfreeman/jsbin.qiyiga.css

## jsbin.qiyiga.css
li{
  font-size:17px;
}

#rect-1 {
  fill:blue;
}

.shape{
  opacity:.4;
}

## jsbin.qiyiga.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Class Exercise 1: Complete" />
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>

  <!-- Create a division of the page -->
  <div>
<!-- In the division, create an ordered list with three list items -->
  <ol>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
  <!-- Close the division of the page -->
    </div>

  <!-- Create a division of the page -->
  <div>
  <!-- Create a scalable vector graphic with width and height attributes set to 200 -->
  <svg width=200 height = 100>


 <!-- Create a circle element that is:
    - 20 pixels from the left of the SVG
    -30 pixels from the top of the SVG
    - Has a radius of 13
-->
    <circle cx=20 cy=30 r=16></circle>
  <!-- Close the scalable vector graphic -->
    </svg>
  <!-- Close the division of the page -->
    </div>

  <!-- Create a division of the page -->
<div>
  <!-- Create a scalable vector graphic with width set to 300 and height set to 200 -->
  <svg width=200 height=300>


  <!-- Add a rectange element that is:
    - 20 pixels from the left of the SVG
    - 40 pixels from the top
    - 10 pixels tall
    - 100 pixels wide
    - Has an id of "rect-1"
  -->
  <rect id="rect-1" x=20 y=40 width=100 height =10></rect>

   <!-- Add a rectange element that is:
    - 20 pixels from the left of the SVG
    - 60 pixels from the top
    - 20 pixels tall
    - 100 pixels wide
    - Has an id of "rect-2"
    - Has a class of "shape"
  -->

      <rect id="rect-r" x=20 y=60 width=100 height =20 class="shape"></rect>

    <!-- Close the scalable vector graphic -->
    </svg>
  <!-- Close the division of the page -->
    </div>

  <!-- Use CSS to make all of the list elements have a font size of 17 pixels -->
  <!-- Use CSS to make the rect-1 element blue -->
  <!-- Use Css to make all elements with the class shape have an opacity of .4 -->


</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="description" content="Class Exercise 1: Complete" />
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body>

	<!-- Create a division of the page -->
	<div>
	<!-- In the division, create an ordered list with three list items -->
	<ol>
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
	<!-- Close the division of the page -->
	</div>

	<!-- Create a division of the page -->
	<div>
	<!-- Create a scalable vector graphic with width and height attributes set to 200 -->
	<svg width=200 height = 100>


	<!-- Create a circle element that is:
	- 20 pixels from the left of the SVG
	-30 pixels from the top of the SVG
	- Has a radius of 13
	-->
	<circle cx=20 cy=30 r=16></circle>
	<!-- Close the scalable vector graphic -->
	</svg>
	<!-- Close the division of the page -->
	</div>

	<!-- Create a division of the page -->
	<div>
	<!-- Create a scalable vector graphic with width set to 300 and height set to 200 -->
	<svg width=200 height=300>


	<!-- Add a rectange element that is:
	- 20 pixels from the left of the SVG
	- 40 pixels from the top
	- 10 pixels tall
	- 100 pixels wide
	- Has an id of "rect-1"
	-->
	<rect id="rect-1" x=20 y=40 width=100 height =10></rect>

	<!-- Add a rectange element that is:
	- 20 pixels from the left of the SVG
	- 60 pixels from the top
	- 20 pixels tall
	- 100 pixels wide
	- Has an id of "rect-2"
	- Has a class of "shape"
	-->

	<rect id="rect-r" x=20 y=60 width=100 height =20 class="shape"></rect>

	<!-- Close the scalable vector graphic -->
	</svg>
	<!-- Close the division of the page -->
	</div>

	<!-- Use CSS to make all of the list elements have a font size of 17 pixels -->
	<!-- Use CSS to make the rect-1 element blue -->
	<!-- Use Css to make all elements with the class shape have an opacity of .4 -->


	</body>
	</html>