Difference between revisions of "Template.html"

From Media Design: Networked & Lens-Based wiki
Jump to navigation Jump to search
Line 22: Line 22:
  
 
NB: When using in PHP, the character set cannot be set with the <?xml> tag -- as this kind of tag conflicts with the PHP parser.
 
NB: When using in PHP, the character set cannot be set with the <?xml> tag -- as this kind of tag conflicts with the PHP parser.
 
== Scripting & CSS ==
 
 
Example with placeholders for Javascript and CSS Stylesheets (both inline and external).
 
 
<source lang="html4strict">
 
<?xml version="1.0" encoding="iso-8859-1"?>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
<head>
 
<title>untitled</title>
 
<!-- external style sheet -->
 
<link rel="stylesheet" type="text/css" href="styles.css" />
 
<!-- external javascript -->
 
<script language="JavaScript" type="text/javascript" src="prototype.js">
 
</script>
 
<!-- inline stylesheet -->
 
<style type="text/css">
 
body {
 
font-family: Arial,Verdana,Helvetica,sans-serif;
 
}
 
</style>
 
<!-- inline javascript -->
 
<script type="text/javascript">
 
function init() {
 
alert("javascript says hello as well");
 
}
 
</script>
 
</head>
 
 
<!-- body with javascript hook (call function when page is finished loading -->
 
<body onload="init()">
 
<p style="font-size: 14px">Hello</p>
 
</body>
 
 
</html>
 
</source>
 

Revision as of 11:52, 15 December 2020

Simple

Template for a modern HTML5 page.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
  <title>Untitled</title>
  <link rel="stylesheet" href="style.css" />
</head>
<body>
<p>Hello world!</p>
</body>
</html>

The DOCTYPE is important to specify. When it's missing, many browsers (Internet Explorer in particular) will format the using "quirks mode" -- or using exceptions to modern CSS rules to support the historical (and deprecated) behavior of web browsers.

NB: When using in PHP, the character set cannot be set with the <?xml> tag -- as this kind of tag conflicts with the PHP parser.