1/*To match to any sibling element after the selector on the left,
2 use the tilde symbol '~'. This is called the general sibling combinator. */
3
4h1 ~ p {
5 color: black;
6}
7
1/*
2Adjecent Sibling Selector
3-------------------------
4example: Select all <p> tags that immediatly follows after <div> tag
5*/
6div + p {
7 background-color: yellow;
8}
9
10/*
11General Sibling Selector
12-------------------------
13example: Select all <p> tags that has a sibling with a <div> tag
14*/
15div ~ p {
16 background-color: yellow;
17}
1/* Paragraphs that come immediately after any image */
2img + p {
3 font-weight: bold;
4}