[css-overflow-5] Add an example for 'scroll-target-group' property (#12449)

As requested in Intent to Ship thread:
https://groups.google.com/a/chromium.org/g/blink-dev/c/R_VD_FkYrF8/m/XDzix9lbAwAJ
adding an example to show how to use 'scroll-target-group' property to
highlight the currently visible chapter within a table of contents.

Author: danielsakhapov

css-overflow-5/Overview.bs

@@ -250,6 +250,42 @@ The 'scroll target group' property</h4>
 
 	</dl>
 
+	<div class='example'>
+		The following snippet demonstrates how to automatically highlight the currently visible chapter within a table of contents
+		<pre><code highlight="html">
+			&lt;!DOCTYPE HTML&gt;
+			&lt;title&gt;scroll-target-group example with a table of contents&lt;/title&gt;
+			&lt;style&gt;
+				ol {
+					background-color: gray;
+					right: 10px;
+					top: 10px;
+					position: fixed;
+					/* Triggers the browser's algorithm for calculating :target-current. */
+					scroll-target-group: auto;
+				}
+
+				a:target-current {
+					color: red;
+				}
+
+				.chapter {
+					background: lightgray;
+					height: 60vh;
+					margin: 10px;
+				}
+			&lt;/style&gt;
+			&lt;ol&gt;
+				&lt;li&gt;&lt;a href="#intro"&gt;Introduction&lt;/a&gt;&lt;/li&gt;
+				&lt;li&gt;&lt;a href="#ch1"&gt;Chapter 1&lt;/a&gt;&lt;/li&gt;
+				&lt;li&gt;&lt;a href="#ch2"&gt;Chapter 2&lt;/a&gt;&lt;/li&gt;
+			&lt;/ol&gt;
+			&lt;div id="intro" class="chapter"&gt;Introduction content&lt;/div&gt;
+			&lt;div id="ch1" class="chapter"&gt;Chapter 1 content&lt;/div&gt;
+			&lt;div id="ch2" class="chapter"&gt;Chapter 2 content&lt;/div&gt;
+		</code></pre>
+	</div>
+
 <h4 id="scroll-marker-group-property">
 The 'scroll-marker-group' property</h4>