<html>
<head>
<title>Abakada HTML Demo: section Element</title>
<link rel="stylesheet" href="/shared/netdemos.css">
<style>
section { background-color: def; border-radius: 30px;
box-shadow: -4px 4px 4px gray; padding: 10 20 }
section.chapter h2 { font: bold 1.5em Roboto, Helvetica Neue, sans-serif; }
section.appendix h2 { font: bold small-caps 1.5em Roboto, Helvetica Neue, sans-serif; }
</style>
</head>
<body>
<div class="header"><h2>Abakada HTML Demo: <b>section Element</b></h2></div>
<!-- #include virtual="~/shared/viewsrc_top.inc" -->
<hr size=1 width=92%>
<header>
<hgroup>
<h1>My Boring Book</h1>
<p>A sample with not much content</p>
</hgroup>
<p><small>Published by Dummy Publicorp Ltd.</small></p>
</header>
<section class="chapter">
<h2>Chapter 1</h2>
<p><i>�I would not wish any companion in the world but you.�</i></p>
<p>A simple yet powerful expression of love and companionship.</p>
</section>
<br>
<section class="chapter">
<h2>Chapter 2</h2>
<p><i>�Love looks not with the eyes, but with the mind, And therefore is winged Cupid painted blind.�</i></p>
<p>This quote from "A Midsummer Night's Dream" emphasizes that true love transcends physical appearance.</p>
</section>
<br>
<section class="chapter">
<h2>Chapter 3</h2>
<p><i>�Shall I compare thee to a summer�s day? Thou art more lovely and more temperate.�</i></p>
<p>This famous line from Sonnet 18 highlights the beauty and constancy of love.</p>
</section>
<br>
<section class="appendix">
<h2>Appendix A: Overview of Examples</h2>
<p>Notable quotes from William Shakespeare, capturing the essence of love in his timeless works.</p>
</section>
<br>
<section class="appendix">
<h2>Appendix B: Some Closing Remarks</h2>
<p>Hopefully this long example shows that you <em>can</em> style sections, so long as they are used to indicate actual sections.</p>
</section>
<hr size=1 width=92%>
<!-- #include virtual="~/shared/viewsrc.inc" -->
</body>
</html>