Short notes on CSS

 div ~ p (all P's in the same hierarchy as div)
div + p (p immediately after div)
div > p (p contained directly under div, there must be no tag in between)
div p (p contained under div even if there's another tag in-between them)

 p::before{
    content: " adds the content here before the p element";
}
p::after {
    content: "adds the content here after the p element";
}

---

div {
    box-shadow: 10px 20px #888888;
   <!-- 
The 10px represents left offset
The 20px represents top offset
}

---

NOTE: The tags used in the examples can be substituted with any valid html tag.