New Elements in HTML5 Below is a list of the new HTML5 elements, and a description of what they are used for. New Semantic/Structural Elements HTML5 offers new elements for better document structure: Tag Description <article> Defines an article <aside> Defines content aside from the page content <audio> Defines sound content <bdi> Isolates a part […]
What is New in HTML5? The DOCTYPE declaration for HTML5 is very simple: <!DOCTYPE html> The character encoding (charset) declaration is also very simple: <meta charset=”UTF-8″> HTML5 Example: <!DOCTYPE html> <html> <head> <meta charset=”UTF-8″> <title>Title of the document</title> </head><body> Content of the document…… </body></html> Try it Yourself » The default character encoding in HTML5 is UTF-8. New HTML5 Elements […]
Small Object The Small object represents an HTML <small> element. Access a Small Object You can access a <small> element by using getElementById(): Example var x = document.getElementById(“mySmall”); Try it Yourself » Create a Small Object You can create a <small> element by using the document.createElement() method: Example var x = document.createElement(“SMALL”); Try it Yourself » Standard […]
Example A ruby annotation: <ruby> 漢 <rt> ㄏㄢˋ </rt> </ruby> Try it Yourself » Definition and Usage The <rt> tag defines an explanation or pronunciation of characters (for East Asian typography) in a ruby annotation. Use the <rt> tag together with the <ruby> and the <rp> tags: The <ruby> element consists of one or more characters that needs an explanation/pronunciation, and an […]
Example A text with word break opportunities: <p> To learn AJAX, you must be familiar with the XML<wbr>Http<wbr>Request Object. </p> Try it Yourself » Definition and Usage The <wbr> (Word Break Opportunity) tag specifies where in a text it would be ok to add a line-break. Tip: When a word is too long, or you are […]
Example Draw a red square, on the fly, and show it inside the <canvas> element: <canvas id=”myCanvas”></canvas> <script> var canvas = document.getElementById(“myCanvas”); var ctx = canvas.getContext(“2d”); ctx.fillStyle = “#FF0000”; ctx.fillRect(0, 0, 80, 80); </script> Try it Yourself » Definition and Usage The <canvas> tag is used to draw graphics, on the fly, via scripting (usually JavaScript). The <canvas> tag is only a container […]
Blockquote Object The Blockquote object represents an HTML <blockquote> element. Access a Blockquote Object You can access a <blockquote> element by using getElementById(): Example var x = document.getElementById(“myBlockquote”); Try it Yourself » Create a Blockquote Object You can create a <blockquote> element by using the document.createElement() method: Example var x = document.createElement(“BLOCKQUOTE”); Try it Yourself » Blockquote […]
Style Guide and Coding Conventions HTML Coding Conventions Web developers are often uncertain about the coding style and syntax to use in HTML. Between 2000 and 2010, many web developers converted from HTML to XHTML. With XHTML, developers were forced to write valid and “well-formed” code. HTML5 is a bit more sloppy when it comes […]
