An old terminal HTML/JS/CSS template I've been working on. Live version
Changing font to 'Px Plus VGA Square Px'.
<link rel="stylesheet" type="text/css" href="css/PxPlusVGASquarePx.css" />
Changing font to 'Press Start 2P'.
<link rel="stylesheet" type="text/css" href="css/PressStart2P.css" />
Chaging color style to green on black.
<link rel="stylesheet" type="text/css" href="css/green_on_black.css" />
Chaging color style to white on blue.
<link rel="stylesheet" type="text/css" href="css/white_on_blue.css" />
Chaging color style to orange on black.
<link rel="stylesheet" type="text/css" href="css/orange_on_black.css" />
Creating a menu bar.
<div id="menu_bar"></div>
Defining where the text will show.
<div id="main_content"></div>
Adding items to the menu bar.
<div id="menu_bar"> <div id="file" class="menu"> <!-- Title //--> <span class="menu_item">File</span> <div id="file_content" class="content"> <ul> <!-- Sub Menus //--> <li id="init"><span> Init </span></li> <li id="file1"><span> File 1 </span></li> <li id="file2"><span> File 2 </span></li> </ul> </div> </div> </div>
Adding content to the menu item .
<div id="init_page" class="page"> <p>Hello World!</p> <p>Good to see you.</p> </div> <div id="file1_page" class="page"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <p>Integer nec odio. Praesent libero.</p> </div> <div id="file2_page" class="page"> <p>Praesent mauris. Fusce nec tellus sed augue semper porta.</p> <p>Mauris massa. Vestibulum lacinia arcu eget nulla.</p> </div>