HTML Inline Formatting for Timeline JS

11 Sep 2019

HTML In-Line Formtatting

Want to change the color of your text in Timeline JS? Use HTML color codes, here's a link to the HTML color codes I used.

What about adding bullet points or a numbered list to organize information in your Timeline? Many options for customization are possible using simple HTML in-line formatting.

Snippet 1: In-line Color Formatting with Color Codes

<p style="color:#7C1505!important;font-size:65px;">Situation Map, 24:00</p>	

Snippet 2: In-line Color Formatting with Color Names

<p style="color:#0431B4!important;font-size:30px;">German invasion of Poland, consensus date for the beginning of WWII.</p>
</code>

Snippet 3: In-line Font-Size Formatting

<h1style="font-size:80px;">Normandy Landings</h1>

Snippet 4: Adding Bullet Points


		<ulstyle="Tehran Conference:disc;">
			<li>FDR, Winston Churchill, Joseph Stalin</li>
			<li>Meeting of Allied officials to discuss German dominance in Europe</li>
			<li>Developed plans that became Operation Bodyguard and Operation Overlord</li>
		</ul>

Snippet 5: Adding An Ordered List


		<olstyle=Normandy Landings:disc;">
			<li>Began on Tuesday the 6th of June 1944.</li>
			<li>Most of the 5 beaches along the coast were secured by 12 June.</li>
			<li>Took Allied forces until 21 July, 1944 to secure Caen, a major French port.</li>
		</ol>