Intro to DIVs

Beginner CSS example.

by Mindy McAdams

HTML

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

<div id="kitty">
  <img src="http://placekitten.com/400/200" alt="Photo of a kitten">

  <p>This photo comes from the 
  <a href="http://placekitten.com/">placekitten</a> site.</p>
</div>

<p>This is another paragraph.</p>

<div id="square">
</div>

<p>This is the last paragraph.</p>

CSS

h1 {
  font-family: sans-serif;
}
#kitty {
  padding: 30px 20px;
  background: #F6FFE0;
  border: 2px dashed #999;
}
#square {
  width: 100px;
  height: 100px;
  background: #0c0;
}
a {
    color: #95AB63;
}
a:hover {
    color: #F6FFE0;
    background: #152C73;
    text-decoration: none;
}