+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!--
+Test the following select handlers via the corresponding CSS
+constructs,
+
+ node_has_attribute : node[attr]
+ node_has_attribute_equal : node[attr=value]
+ node_has_attribute_dashmatch : node[attr|=value]
+ node_has_attribute_includes : node[attr~=value]
+ node_has_attribute_prefix : node[attr^=value]
+ node_has_attribute_suffix : node[attr$=value]
+ node_has_attribute_substring : node[attr*=value]
+
+The result should be an empty document with a 5px red border, because
+we're using each of the seven selectors above to make one of the seven
+rectangles transparent. The first rectangle however has a 5px red
+stroke that is not affected by the fill-opacity, so that stroke will
+remain visible.
+-->
+<svg width="640"
+ height="480"
+ viewBox="0 0 640 480"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:svg="http://www.w3.org/2000/svg">
+
+ <style>
+ rect[stroke] {
+ fill-opacity: 0;
+ }
+ rect[fill="green"] {
+ fill-opacity: 0;
+ }
+ rect[fill|="black"] {
+ fill-opacity: 0;
+ }
+ rect[class~="yellow"] {
+ fill-opacity: 0;
+ }
+ rect[fill^="ora"] {
+ fill-opacity: 0;
+ }
+ rect[fill$="urple"] {
+ fill-opacity: 0;
+ }
+ rect[fill*="rquoi"] {
+ fill-opacity: 0;
+ }
+ </style>
+
+ <rect x="0"
+ y="0"
+ width="640"
+ height="480"
+ fill="red"
+ stroke="red"
+ stroke-width="5" />
+
+ <rect x="0"
+ y="0"
+ width="640"
+ height="480"
+ fill="green" />
+
+ <rect x="0"
+ y="0"
+ width="640"
+ height="480"
+ fill="black" />
+
+ <rect x="0"
+ y="0"
+ class="a yellow rectangle"
+ width="640"
+ height="480"
+ fill="yellow" />
+
+ <rect x="0"
+ y="0"
+ width="640"
+ height="480"
+ fill="orange" />
+
+ <rect x="0"
+ y="0"
+ width="640"
+ height="480"
+ fill="purple" />
+
+ <rect x="0"
+ y="0"
+ width="640"
+ height="480"
+ fill="turquoise" />
+</svg>