What is HTML5 Syntax?

HTML5 elements can contain attributes that are used for setting different properties of the element. All attributes have a name and a value:

The DOCTYPE

<!DOCTYPE html>

Meta Character Encoding

<meta charset = "UTF-8">

The <script> tag

<script src = "scriptfile.js"></script>

<link> tag

The<link>?tag defines the relationship between the document and external resources. I.e. in simple words, it is used to include the CSS files.

Use <link>? tag in <head>

<link rel = "stylesheet" href = "stylefile.css">

HTML5 Attributes

AttributeOptionsFunction
accesskeyUser DefinedSpecifies a keyboard shortcut to access an element.
alignright, left, centerHorizontally aligns tags
backgroundURLPlaces a background image behind an element
bgcolornumeric, hexadecimal, RGB valuesPlaces a background color behind an element
classUser-DefinedClassifies an element for use with Cascading Style Sheets.
contenteditabletrue, falseSpecifies if the user can edit the element’s content or not.
contextmenuMenu idSpecifies the context menu for an element.
data-XXXXUser DefinedCustom attributes. Authors of an HTML document can define their own attributes. Must start with “data-“.
draggabletrue,false, autoSpecifies whether or not a user is allowed to drag an element.
heightNumeric ValueSpecifies the height of tables, images, or table cells.
hiddenhiddenSpecifies whether the element should be visible or not.
idUser DefinedNames an element for use with Cascading Style Sheets.
itemList of elementsUsed to group elements.
itempropList of itemsUsed to group items.
spellchecktrue, falseSpecifies if the element must have it’s spelling or grammar checked.
styleCSS Style sheetSpecifies an inline style for an element.
subjectUser define idSpecifies the element’s corresponding item.
tabindexTab numberSpecifies the tab order of an element.
titleUser Defined“Pop-up” title for your elements.
valigntop, middle, bottomVertically aligns tags within an HTML element.
widthNumeric ValueSpecifies the width of tables, images, or table cells.

HTML5 Document

The following tags have been introduced for better structure

  • section
  • article
  • aside
  • header
  • footer
  • nav
  • dialog
  • figure

HTML5 document which includes CSS and Java Script

<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Web Page Title is here</title> 
        <script src="script.js"></script>
        <link rel="stylesheet" href="style.css">   
    </head>
    <body>
     <p>web page content goes here</p>
    </body>
</html>