Hello, world!

HTML 5 Support HTML

HTML 5 is supported in the recent versions of the most known browsers today such as Safari, Chrome, Firefox, Opera and Internet Explorer. In this HTML tutorial also will explain the supported mobile web browsers in using HTML 5.


Browser Support for HTML5

Some HTML5 features are supported in the latest versions of Apple Safari, Google Chrome, Mozilla Firefox, Opera and Internet Explorer 9.0. HTML 5 is supported as well in mobile web browsers that come pre-installed on iPhones, iPads, and Android. Moreover, old and latest browsers, automatically handle unknown elements as inline elements. That is why you can "direct" old browsers to handle "unknown" HTML elements.

Identifying HTML5 Elements as Block Elements

8 new semantic HTML elements is define by HTML5, which are all block level elements. Just set the CSS display property to block in order to achieve proper behavior in older browsers.
Example:

header, section, footer, aside, nav, main, article, figure {
    display: block;
}

How to Insert New Elements to HTML

Using a browser trick, you can include every new element to HTML:
Adding a new element called <myHTML5> to HTML, and identifies a display style for it:

HTML code example adding new elements to html:

<!DOCTYPE html>
<html>
<head>
  <title>How to create an HTML Element</title>
  <script>document.createElement("myHTML5")</script>
  <style>
  myHTML5 {
     display:block;
      background-color:#eee;
      padding: 40px;
      font-size: 20px;
  }
  </style>
</head>
<body>
<h1>Heading</h1>
<p>Paragraph</p>
<myHTML5>My First HTML</myHTML5>
</body>
</html>

The JavaScript statement document.createElement("myHTML5") is added, only to suit IE.

Problem Occured in Internet Explorer

IE 8 and earlier version, does not authorize styling of unknown elements.
Through "the shiv", built by Sjoerd Visscher JavaScript is now enabled in HTML5 JavaScript:

<!--[if lt IE 9]>
  <script src="URL"></script>
<![endif]-->

Comprehensive Shiv Solution

HTML code example full shiv solution:

<!DOCTYPE html>
<html>
<head>
  <title>HTML5 Styling</title>
  <!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.js"></script>
  <![endif]-->
</head>
<body>
<h1>The shiv Solution</h1>
<article>
IE 8 and earlier version, does not authorize styling of unknown elements.Through "the shiv", created by Sjoerd Visscher you can enable HTML5 JavaScript.
</article>
</body>
</html>

HTML5 Outline

HTML code example html5 outline:

<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML5</title>
<meta charset="utf-8">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
<style>
body {font-family: Arial, sans-serif; font-size:0.8em;}
header, nav, section, article, footer
{border:1px solid grey; margin:5px; padding:8px;}
nav ul {margin:0; padding:0;}
nav ul li {display:inline; margin:6px;}
</style>
</head>
<body>
<header>
<h1>HTML5 Outline</h1>
</header>
<nav>
<ul>
  <li><a href="http://ny.pe/">Home</a></li>
  <li><a href="http://ny.pe/about">About</a></li>
  <li><a href=" http://images-of.eu/Categories ">Categories</a></li>
</ul>
</nav>
<section>
<h2>THE BEATITUDES </h2>
<article>
<h2>Matthew 5:3</h2>
<p>Blessed are the poor in spirit,
for theirs is the kingdom of heaven.</p>
</article>
<article>
<h2>Matthew 5:4</h2>
<p>Blessed are they who mourn, for they shall be comforted.</p>
</article>
<article>
<h2>Matthew 5:5</h2>
<p>Blessed are the meek, for they shall inherit the earth.</p>
</article>
</section>
<footer>
<p>&copy; 2015 Ny.pe. All rights reserved.</p>
</footer>
</body>
</html>