| <!doctype html> | |
| <html> | |
| <head> | |
| <style> | |
| body { | |
| font-family: monospace; | |
| } | |
| h2 { | |
| margin: 0; | |
| font-size: 2em; | |
| } | |
| p { | |
| margin: 0; | |
| font-size: 1em; | |
| } | |
| #div-container { | |
| width: 13em; | |
| height: 10em; | |
| background-color: lightgray; | |
| } | |
| #title-container { | |
| width: 20em; | |
| height: 10em; | |
| background-color: silver; | |
| } | |
| .green-text { | |
| color: green; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| Scope-styled elements extracted in region along with the parent. | |
| <div id='div-container'> | |
| <p class='green-text'>Styled line of text Styled line of text Styled line of text</p> | |
| <p>Normal line of text Normal line of text Normal line of text</p> | |
| </div> | |
| Scope-styled elements extracted in region without the parent. | |
| <div id='title-container'> | |
| <h2>Title one</h2> | |
| <h2 class='green-text'>Title two</h2> | |
| <h2>Title three</h2> | |
| </div> | |
| </body> | |
| </html> |