Fringe Style ( black version )

Last updated : 

These are the same styles that I used for my Fringe Mastodev series, as seen here :

A History:

Fringe Mastodev – Part IV: Intermission

Usage

This style expects a page layout like the following : 

<article>
	<header>
		<!-- Header information -->
	</header>
	<!-- Page content -->
	<footer>
		<!-- Footer information -->
	</footer>
</article>

There are a few special classes : Use <strong class="MARK"> to mark text ; use <span class="PARENTHETICAL"> for inline parenthetical content ( like this ) ; use <span class="OPTION"> and <span class="CASE"> for a list of choices { like this | or this }, and use <i class="SO-CALLED"> for scare quotes.

Set the PARAGRAPH class on non­‑<p> block elements that you want to be numbered as though they were paragraphs ; this is especially useful for lists…

Finally, you can make your own link previews by using code like the following : 

<a class="PREVIEW" href="http://example.com">
	<cite>Title</cite>
	<p>by Author</p>
	<time>1972-12-31</time>
</a>

…Which will look like this :

Title

by Author