HTML5 Skeleton with Bootstrap CSS and jQuery 3 Document Ready

This skeleton template allows you to quickly write a web page.

It includes the boilerplate you would write anyway: Bootstrap CSS and an inline style; jQuery and a document ready function; and some text wrapped in a div.container.

All external resources are from CDNs (content delivery networks) to make this a standalone page. Of course, you can serve JS and CSS from your own servers later.

If you want, there is also the short HTML5 template.

Updated: added HTML5 logo, improved copy.

HTML Template

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<title>Hello HTML5</title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
			integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous" />
		<style>
			#status { font-style: italic; }
		</style>
	</head>
	<body>
		<div class="container">
			<h1>Hello HTML5</h1>
			<p>See you at <a href="http://TeroKarvinen.com">TeroKarvinen.com</a>!</p>
			<p id="status">Loading...</p>
		</div>

		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
			integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
		<script>
			function onReady() {
				$("#status").text("Hello jQuery world!");
			}

			$(document).ready(onReady);
		</script>
	</body>
</html>

Posted in Uncategorized | Tagged , , , , , | Leave a comment

Leave a Reply

Your email address will not be published. Required fields are marked *

*

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

  • Picks

  • Boxing Clock for AndroidOcton8 Diving T-ShirtsShaking Tower Panda Android GameLearn Chinese with Android
  • Student projects