Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

(Nora) #1

40 CHAPTER 2 Getting started with HTML5


Adding conditional comments
Only Internet Explorer recognizes conditional comments, which enable you to add a browser-
specific source that executes if the browser is Internet Explorer but is treated as a comment
by other browsers. You can add conditional comments to your HTML document by using the
following syntax.
<!--[if lte IE 7]> <html class="no-js ie6" lang="en"> <![endif]-->
<!--[if lt IE 7]> <html class="no-js ie6" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8" lang="en"> <![endif]-->
<!--[if gt IE 8]> <html class="no-js" lang="en"> <![endif]-->
<!--[if gte IE 9]> <html class="no-js" lang="en"> <![endif]-->
<!--[if !IE]> --> This is not Internet Explorer!<br /> <!-- <![endif]-->

The first conditional comment checks whether the browser is Internet Explorer and the
version is earlier than or equal to 7. The next conditional comment checks whether the
browser is Internet Explorer and the version is earlier than 7. The next conditional comment
checks whether the browser is Internet Explorer and the version is 8. The next conditional
comment checks whether the browser is Internet Explorer and the version is later than 8, fol-
lowed by a check to see whether the browser is Internet Explorer and the version is later than
or equal to 9. The last line checks whether the browser is not Internet Explorer. Note that the
syntax of the last line is different from the others.

Creating an HTML document


Now that you’ve seen the various elements and attributes, it’s time to group them in a mean-
ingful way to create an HTML document. The HTML document contains an outer structure,
metadata, and some content.

Basic document structure
Every HTML document should have a basic structure that consists of a <!DOCTYPE html>
declaration, which historically has indicated the version of HTML to the browser. In HTML5,
this indicates to the browser that it should be in no-quirks mode. No-quirks mode causes the
browser to operate in an HTML5-compliant manner. Next is the root <html> element, which
contains the <head> element and the <body> element.
The <head> element contains hidden information such as metadata that describes the
HTML document and instructions. The following is an example of metadata in the <head>
element.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>title here</title>
</head>
<body>
content here

Key
Te rms

Key
Te rms
Free download pdf