HTML Elements By Group
HTML elements can be grouped by the type of content they mark up in your web document. Some groups of HTML elements are for formatting text, some groups handle media, some groups handle form building and so on.
Primary elements of a web document
<!DOCTYPE> - set your doctype declaration
<html> - the root element
<head> - apply the meta data container
<title> - apply title to your page
<link> - connent to other documents
<meta> - add metadata to your document
<style> - add style to your elements
<script> – add Javascript to your page
<noscript> – handle users who disable Javascript
<body> - establish the document body
<base> - apply base URL to resolve relative links
Content sections of a web document
<h1>....<h6> - add headings
<div> - add a division
<address> - add contact information
<section> establish a section in the document → HTML5
<nav> - establish a navigation menu → HTML5
<article> - add an article region → HTML5
<aside> - add slightly related content → HTML5
<hgroup> - group headings → HTML5
<header> - add header → HTML5
<footer> - add footer → HTML5
Embedding images and multimedia into web documents
<img> – add image
<iframe> – add inline frame
<object> – add plugin content
<param> – add plugin parameters
<map> – add image map
<area> – add image map hyperlink area
<audio> – play music audio and files → HTML5
<video> – play videos → HTML5
<canvas> – canvas for dynamic graphics and animations → HTML5
<embed> – add plugin based media objects → HTML5
<source> – establish media file sources → HTML5
<track> – add timed text tracks to media → HTML5
Building forms and adding form components
<form> – add a form
<fieldset> – create a form components field set
<legend> – fieldset title text
<label> – add labels to form components
<input> – add many types of form inputs to intake data
<button> – add a button
<select> – add a selection list form component
<optgroup> – group options together
<option> – create options
<textarea> – intake multiple lines of text from users
<datalist> – add data lists to form components → HTML5
<keygen> – generate keys → HTML5
<output> – output data calculation results in a form → HTML5
<progress> – add progress bar → HTML5
<meter> – add gauges → HTML5
Table construction in a web document
<table> – add table
<tr> – add row
<td> – add cell to row
<th> – add header cell
<col> – add column
<colgroup> – add column group
<caption> – add title
<tbody> – add row group
<thead> – add heading group
<tfoot> – add footer row group
Text formatting in a web document
<a> – format text to create links
<i> – format text to italics
<b> – format text to bold
<u> – format text to underlined
<em> – format emphatic stress text
<strong> – format strong text
<small> – format fine print
<span> – format a span of text
<abbr> – format abbreviated text
<cite> – format cited title
<q> – format quoted text
<dfn> – format definable term text
<code> – format computer code
<var> – format variable
<samp> – format program output
<kbd> – format user input text
<sub> <sup> – format text to subscript and superscript
<bdo> – format text backwards
<ins> – format inserted text
<del> – format deleted text
<time> – format date and time text → HTML5
<mark> – format highlights to text → HTML5
<ruby> <rt> <rp> – format ruby annotations → HTML5
<bdi> – format isolated text → HTML5
User initiated content and context
<menu> – add list of commands
<details> – add additional information on demand → HTML5
<summary> – add captions or summary → HTML5
<command> – add command to menu → HTML5
Primary elements of a web document
<!DOCTYPE> - set your doctype declaration
<html> - the root element
<head> - apply the meta data container
<title> - apply title to your page
<link> - connent to other documents
<meta> - add metadata to your document
<style> - add style to your elements
<script> – add Javascript to your page
<noscript> – handle users who disable Javascript
<body> - establish the document body
<base> - apply base URL to resolve relative links
Content sections of a web document
<h1>....<h6> - add headings
<div> - add a division
<address> - add contact information
<section> establish a section in the document → HTML5
<nav> - establish a navigation menu → HTML5
<article> - add an article region → HTML5
<aside> - add slightly related content → HTML5
<hgroup> - group headings → HTML5
<header> - add header → HTML5
<footer> - add footer → HTML5
Embedding images and multimedia into web documents
<img> – add image
<iframe> – add inline frame
<object> – add plugin content
<param> – add plugin parameters
<map> – add image map
<area> – add image map hyperlink area
<audio> – play music audio and files → HTML5
<video> – play videos → HTML5
<canvas> – canvas for dynamic graphics and animations → HTML5
<embed> – add plugin based media objects → HTML5
<source> – establish media file sources → HTML5
<track> – add timed text tracks to media → HTML5
Building forms and adding form components
<form> – add a form
<fieldset> – create a form components field set
<legend> – fieldset title text
<label> – add labels to form components
<input> – add many types of form inputs to intake data
<button> – add a button
<select> – add a selection list form component
<optgroup> – group options together
<option> – create options
<textarea> – intake multiple lines of text from users
<datalist> – add data lists to form components → HTML5
<keygen> – generate keys → HTML5
<output> – output data calculation results in a form → HTML5
<progress> – add progress bar → HTML5
<meter> – add gauges → HTML5
Table construction in a web document
<table> – add table
<tr> – add row
<td> – add cell to row
<th> – add header cell
<col> – add column
<colgroup> – add column group
<caption> – add title
<tbody> – add row group
<thead> – add heading group
<tfoot> – add footer row group
Text formatting in a web document
<a> – format text to create links
<i> – format text to italics
<b> – format text to bold
<u> – format text to underlined
<em> – format emphatic stress text
<strong> – format strong text
<small> – format fine print
<span> – format a span of text
<abbr> – format abbreviated text
<cite> – format cited title
<q> – format quoted text
<dfn> – format definable term text
<code> – format computer code
<var> – format variable
<samp> – format program output
<kbd> – format user input text
<sub> <sup> – format text to subscript and superscript
<bdo> – format text backwards
<ins> – format inserted text
<del> – format deleted text
<time> – format date and time text → HTML5
<mark> – format highlights to text → HTML5
<ruby> <rt> <rp> – format ruby annotations → HTML5
<bdi> – format isolated text → HTML5
User initiated content and context
<menu> – add list of commands
<details> – add additional information on demand → HTML5
<summary> – add captions or summary → HTML5
<command> – add command to menu → HTML5
0 Response to "HTML Elements By Group"
Post a Comment