This is my <style> block:
<style> p {text-align:left; font-size:10pt; font-family:Arial,sans-serif; line-height:1.2em;} br.big {display:block; content:""; margin-top:0.5em; line-height:190%; vertical-align:top;} p.big {margin-top:1.5em} </style>
<p><b style="font-size:12pt">I'm showing the tags in red.</b><br>
<br>
<b>This page illustrates ways of adding variable amounts of extra vertical space after a “<br>
” line break (or between paragraphs).</b><br>
This line ends in a plain “<br>
” tag.<br>
This next line ends in “<br/>
” (the effect is identical).<br/>
This line is sufficiently long that it exceeds 40em (the max-width), so that it will wrap and occupy two lines on the screen.<br>
This line ends has a bit of extra space after it, via the “vertical-align:-37%
” trick.<span style="vertical-align:-37%"> </span><br/>
You don't need to use “
” because all other space characters also work, including regular space, thin space ( ), hair space ( ), zero-width space (​), and zero-wdith no-break space (BOM = U+FEFF =  = ).<span style="vertical-align:-37%"></span><br>
In fact, to my surprise, it even works with no space at all (but I don't recommend this, because it's surprising, and because an HTML optimizer might remove it):<br>
This line demonstrates it.<span style="vertical-align:-37%"></span><br>
37% looks nice, but there's nothing magical about it. This line uses 75% for more vertical space.<span style="vertical-align:-75%"> </span><br>
This line uses 25% for a smaller gap.<span style="vertical-align:-25%"> </span><br>
This is the last line of the paragraph, which is intentionally very long, so that it will exceed the max-width and wrap onto more than one line on the screen, so that you can see the spacing
difference.</p>
<p>This is a new paragraph, beginning with <p>
and ending with </p>
.</p>
<p>This is another new paragraph, beginning with <p>
and ending with </p>
.</p>
<p class=big>This is a new paragraph, beginning with <p class=big>
so that it will have a bit of extra space before the first line.</p>
<p>In this paragraph, the first line is intentionally very long, so that it will exceed 40em (the max-width) and wrap onto more than one line on the screen, so that you can see the default line-spacing.<br>
This is a short line.<br>
This is another short line, but with extra space after it.<br class=big>
This is another short line, still within the same paragraph, but with normal space after it.<br>
This is another short line, but with two line-breaks.<br><br>
This is the last line of the paragraph.</p>