csstdg5figs/03-pseudo-class-and-element-selectors/selecting-images-only-children-2.html at main · meyerweb/csstdg5figs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Selecting images that are only children inside links</title>
<style type="text/css">
img {vertical-align: bottom;}
a {display: block;}
a[href] img:only-child {border: 5px solid black;}
</style>
</head>
<body>

<a href="http://w3.org/"><img src="i/w3.png" alt="W3C"></a>
<a href="http://w3.org/"><span><img src="i/w3.png" alt="W3C"></span></a>
<a href="http://w3.org/">A link to <span>the <img src="i/w3.png" alt=""> web</span> site</a>

</body>
</html>