Musical text

To have printable page with A4 format, include book‐A4.min.css in header of HTML page.

Files to include in HTML file header

<link rel="stylesheet" href="css/book‐A4.min.css" />
<link rel="stylesheet" href="css/music.min.css" />

<h1>Header1</h1>

Header1

<h2>Header2</h2>

Header2

<h3>Header3</h3>

Header3

<h4>Header4</h4>

Header4

<p>paragraph</p>

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.

<ul>non ordered list</ul>

Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.
Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat.

<ol>ordered list</ol>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Aliquam tincidunt mauris eu risus.

Rules

<div class="neutral">With gray, it's neutral.</div>

With gray, it's neutral.

<div class="definition">Use blue for definition.</div>

Use blue for definition.

<div class="warning">Use yellow for warning.</div>

Use yellow for warning.

<div class="rule use">Use green for rule to use.</div>

Use green for rule to use.

<div class="rule avoid">Use orange for rule to avoid.</div>

Use orange for rule to avoid.

<div class="rule not">Use red for
FORBIDDEN rule.</div>

Use red for
FORBIDDEN rule.

Intervals coloring

<span class="T3">diminished third</span>,
<span class="T3">minor third</span>,
<span class="T3M">major third</span>,
<span class="T3">augmented third</span>.

P1=unison, P8=octave.
m2=minor second, M2=major second, A2=augmented second.
D3=diminished third, m3=minor third, M3=major third, A3=augmented third.
D4=diminished fourth, P4=perfect fourth, A4=augmented fourth.
D5=diminished fifth, P5=perfect fifth, A5=augmented fifth.
D6=diminished sixth, m6=minor sixth, M6=major sixth, A6=augmented sixth.
D7=diminished seven, m7=minor seven, M7=major seven.