4c4
< <title>Complex Pseudo Class Attribute CSS Selectors - RJM Programming - August, 2016 ... Thanks to http://learn.shayhowe.com/advanced-html-css/complex-selectors/</title>
---
> <title>Complex Attribute CSS Selectors - RJM Programming - August, 2016 ... Thanks to http://learn.shayhowe.com/advanced-html-css/complex-selectors/</title>
7,8c7
< h2 + a[href="#"]:link { color: blue; }
< h2 + a[href="#"]:visited { color: green; }
---
> h2 + a[href="#"] { color: blue; }
14c13
< h2 ~ a[href="http://www.rjmprogramming.com.au"]:hover { background-color: orange; }
---
> h2 ~ a[href="http://www.rjmprogramming.com.au"] { background-color: orange; }
21,23d19
< section > a:first-child { background-color: cyan; }
< section > a[href*="rjmprogramming.com.au"]:last-child { background-color: pink; }
< 
25,26d20
< img:only-of-type { border: 5px solid green; }
< img:only-child { border: 5px solid yellow; }
32,33c26,27
< <table><tr><th colspan=3>Complex Pseudo Class Attribute CSS Selectors - RJM Programming - August, 2016</th></tr><tr><td>
< <textarea rows=32 cols=45 style='background-color: silver;'>
---
> <table><tr><th colspan=3>Complex Attribute CSS Selectors - RJM Programming - August, 2016</th></tr><tr><td>
> <textarea rows=23 cols=45 style='background-color: silver;'>
36,37c30
< h2 + a[href="#"]:link { color: blue; }
< h2 + a[href="#"]:visited { color: green; }
---
> h2 + a[href="#"] { color: blue; }
43c36
< h2 ~ a[href="http://www.rjmprogramming.com.au"]:hover { background-color: orange; }
---
> h2 ~ a[href="http://www.rjmprogramming.com.au"] { background-color: orange; }
48,51c41
< article &gt; a[href="#"] { font-style: italic; }
< 
< section &gt; a:first-child { background-color: cyan; }
< section &gt; a[href*="rjmprogramming.com.au"]:last-child { background-color: pink; }
---
> article > a[href="#"] { font-style: italic; }
54,55d43
< img:only-of-type { border: 5px solid green; }
< img:only-child { border: 5px solid yellow; }
58,59c46,47
< <textarea rows=38 cols=90 style='background-color: pink;'>
< &lt;a href="#"&gt;Default text colour is black ... This is an unselected a outside section ...&lt;img src="#"&gt; ... but img gets a yellow border as the :only-child of a parent element&lt;/a&gt;
---
> <textarea rows=27 cols=90 style='background-color: pink;'>
> &lt;a href="#"&gt;Default text colour is black ... This is an unselected a outside section ...&lt;/a&gt;
61c49
<   &lt;a href="#"&gt;... This is selected with background colour cyan because it is a section :first-child a within section ...&lt;/a&gt;
---
>   &lt;a href="#"&gt;... This is an unselected a within section ...&lt;/a&gt;
63,65c51,52
<   &lt;a href="#"&gt;This h2 ~ a and h2 + a section paragraph will be selected as a "General Sibling" and so background-color will be lightblue and will be selected as an "Adjacent Sibling" so font colour will be blue, but only having never been visited as :link, else it will be green as :visited&lt;/a&gt;&lt;br&gt;
<   &lt;a target="_blank" href="http://www.rjmprogramming.com.au"&gt;Another h2 ~ a and h2 + a section paragraph will be selected, but only on hovering as :hover, as a "General Sibling" and so background-color will be orange given Attribute a[href="http://www.rjmprogramming.com.au"] and will be selected as an "Adjacent Sibling" so font colour will be blue and will be bold given the Attribute select a[target="_blank"]&lt;/a&gt;&lt;br&gt;
<   &lt;a target="_blank" href="http://www.rjmprogramming.com.au/About_Us.html"&gt;Last of h2 ~ a section paragraphs will be selected, but only on hovering as :hover, as a "General Sibling" and so background-color will be pink as the :last-child given Attribute a[href*="rjmprogramming.com.au"] contains domain "rjmprogramming.com.au" and will be selected as an "Adjacent Sibling" so font colour will be blue and will be bold given the Attribute select a[target="_blank"]&lt;/a&gt;&lt;br&gt;
---
>   &lt;a href="#"&gt;This h2 ~ a and h2 + a section paragraph will be selected as a "General Sibling" and so background-color will be lightblue and will be selected as an "Adjacent Sibling" so font colour will be blue&lt;/a&gt;&lt;br&gt;
>   &lt;a target="_blank" href="http://www.rjmprogramming.com.au"&gt;Another h2 ~ a and h2 + a section paragraph will be selected as a "General Sibling" and so background-color will be orange given Attribute a[href="http://www.rjmprogramming.com.au"] and will be selected as an "Adjacent Sibling" so font colour will be blue and will be bold given the Attribute select a[target="_blank"]&lt;/a&gt;
75c62
<     &lt;a href="#"&gt;... This is an unselected a within article ...&lt;/a&gt;&lt;img src="#"&gt; ... but the img that follows gets a green border being the :only-of-type within the parent element
---
>     &lt;a href="#"&gt;... This is an unselected a within article ...&lt;/a&gt;
83c70
< <a href="#">Default text colour is black ... This is an unselected a outside section ...<img src="#"> ... but img gets a yellow border as the :only-child of a parent element</a>
---
> <a href="#">Default text colour is black ... This is an unselected a outside section ...</a>
85c72
<   <a href="#">... This is selected with background colour cyan because it is a section :first-child a within section ...</a>
---
>   <a href="#">... This is an unselected a within section ...</a>
87c74
<   <a href="#">This h2 ~ a and h2 + a section paragraph will be selected as a "General Sibling" and so background-color will be lightblue and will be selected as an "Adjacent Sibling" so font colour will be blue, but only having never been visited as :link, else it will be green as :visited</a>
---
>   <a href="#">This h2 ~ a and h2 + a section paragraph will be selected as a "General Sibling" and so background-color will be lightblue and will be selected as an "Adjacent Sibling" so font colour will be blue</a>
92,93c79
<   <a target="_blank" href="http://www.rjmprogramming.com.au">Another h2 ~ a section paragraph will be selected, but only on hovering as :hover, as a "General Sibling" and so background-color will be orange given Attribute a[href="http://www.rjmprogramming.com.au"] and will be selected as an "Adjacent Sibling" so font colour will be blue and will be bold given the Attribute select a[target="_blank"]</a><br>
<   <a target="_blank" href="http://www.rjmprogramming.com.au/About_Us.html">Last of h2 ~ a section paragraphs will be selected, but only on hovering as :hover, as a "General Sibling" and so background-color will be pink as the :last-child given Attribute a[href*="rjmprogramming.com.au"] contains domain "rjmprogramming.com.au" and will be selected as an "Adjacent Sibling" so font colour will be blue and will be bold given the Attribute select a[target="_blank"]</a>
---
>   <a target="_blank" href="http://www.rjmprogramming.com.au">Another h2 ~ a section paragraph will be selected as a "General Sibling" and so background-color will be  will be orange given Attribute a[href="http://www.rjmprogramming.com.au"] and will be selected as an "Adjacent Sibling" so font colour will be blue and will be bold given the Attribute select a[target="_blank"]</a>
99c85
<     <a href="#">... This is an unselected a within article ...</a><img src="#"> ... but the img that follows gets a green border being the :only-of-type within the parent element
---
>     <a href="#">... This is an unselected a within article ...</a>