DOCTYPE HTML

<!
DOCTYPE html>
<html lang="en-US">
<head>
<title>HTML Examples</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="Keywords" content="HTML,CSS,JavaScript,SQL,PHP,jQuery,XML,DOM,Bootstrap,Web
development,W3C,tutorials,programming,training,learning,quiz,primer,lessons,references,examples,source
code,colors,demos,tips">
<meta name="Description" content="Well organized and easy to understand Web building tutorials with lots
of examples of how to use HTML, CSS, JavaScript, SQL, PHP, and XML.">
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="/lib/w3.css">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-3855518-1', 'auto');
ga('require', 'displayfeatures');
ga('send', 'pageview');
</script>
<script type='text/javascript'>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' == document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') +
'//www.googletagservices.com/tag/js/gpt.js';
var node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
</script>
// GPT slots
var gptAdSlots = [];
googletag.cmd.push(function() {
var leaderMapping = googletag.sizeMapping().
// Mobile ad
addSize([0, 0], [320, 50]).
// Vertical Tablet ad
addSize([480, 0], [468, 60]).
// Horizontal Tablet
addSize([750, 0], [728, 90]).
// Small Desktop
addSize([993, 0], [468, 60]).
// Normal Desktop
addSize([1135, 0], [728, 90]).

// Large Desktop and bigger ad
addSize([1425, 0], [[728, 90], [970, 90]]).build();
gptAdSlots[0] = googletag.defineSlot('/16833175/MainLeaderboard', [[728, 90], [970, 90]], 'div-gpt-ad1422003450156-2').
defineSizeMapping(leaderMapping).addService(googletag.pubads());
var skyMapping = googletag.sizeMapping().
// Mobile ad
addSize([0, 0], [320, 50]).
// Tablet ad
addSize([975, 0], [120, 600]).
// Desktop
addSize([1135, 0], [160, 600]).
// Large Desktop
addSize([1675, 0], [[160, 600], [300, 600], [300, 1050]]).build();
gptAdSlots[1] = googletag.defineSlot('/16833175/WideSkyScraper', [[160, 600], [300, 600], [300, 1050]],
'div-gpt-ad-1422003450156-5').
defineSizeMapping(skyMapping).addService(googletag.pubads());
var stickyMapping = googletag.sizeMapping().
// Mobile ad
addSize([0, 0], []).
// Tablet ad
addSize([975, 0], [120, 600]).
// Desktop
addSize([1135, 0], [160, 600]).
// Large Desktop
addSize([1675, 0], [[160, 600], [300, 600], [300, 250]]).build();
gptAdSlots[4] = googletag.defineSlot('/16833175/StickySkyScraper', [[300, 600], [120, 600], [300, 250],
[160, 600]], 'div-gpt-ad-1472547360578-0').
defineSizeMapping(stickyMapping).addService(googletag.pubads());
var bmrMapping = googletag.sizeMapping().
// Smaller
addSize([0, 0], [[300, 250], [336, 280]]).
// Large Desktop
addSize([1200, 0], [[300, 250], [336, 280], [970, 250]]).build();
gptAdSlots[2] = googletag.defineSlot('/16833175/BottomMediumRectangle', [[300, 250], [336, 280], [970,
250]], 'div-gpt-ad-1422003450156-0').
defineSizeMapping(bmrMapping).setCollapseEmptyDiv(true).addService(googletag.pubads());
var rbmrMapping = googletag.sizeMapping().
// Smaller
addSize([0, 0], []).
// Large Desktop
addSize([975, 0], [[300, 250], [336, 280]]).build();
gptAdSlots[3] = googletag.defineSlot('/16833175/RightBottomMediumRectangle', [[300, 250], [336, 280]],
'div-gpt-ad-1422003450156-3').
defineSizeMapping(rbmrMapping).setCollapseEmptyDiv(true).addService(googletag.pubads());
googletag.pubads().setTargeting("content",(function () {
var folder = location.pathname;
folder = folder.replace("/", "");
folder = folder.substr(0, folder.indexOf("/"));
return folder;
})()
);
googletag.enableServices();
});
</script>
<script>
var stickyadstatus = "";
function fix_stickyad() {
var elem = document.getElementById("stickyadcontainer");
var skyWidth = Number(w3_getStyleValue(document.getElementById("skyscraper"), "width").replace("px",
""));
elem.style.width = skyWidth + "px";
if (window.innerWidth <= 992) {
elem.style.position = "";
elem.style.top = stickypos + "px";
return false;
}
var stickypos = document.getElementById("stickypos").offsetTop;
var docTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
var adHeight = Number(w3_getStyleValue(elem, "height").replace("px", ""));
if (stickyadstatus == "") {
if ((stickypos - docTop) < 60) {
elem.style.position = "fixed";
elem.style.top = "60px";
stickyadstatus = "sticky";
}
} else {
if ((docTop + 60) - stickypos < 0) {
elem.style.position = "";
elem.style.top = stickypos + "px";
stickyadstatus = "";
}
}
if (stickyadstatus == "sticky") {
if ((docTop + adHeight + 60) > document.getElementById("footer").offsetTop) {
elem.style.position = "absolute";
elem.style.top = (document.getElementById("footer").offsetTop - adHeight) + "px";
} else {
elem.style.position = "fixed";
elem.style.top = "60px";
stickyadstatus = "sticky";
}
}
}
function w3_getStyleValue(elmnt,style) {
if (window.getComputedStyle) {
return window.getComputedStyle(elmnt,null).getPropertyValue(style);
} else {
return elmnt.currentStyle[style];
}
}
</script>
<link rel="stylesheet" type="text/css" href="/stdtheme.css"></head>
<body>
<div class='w3-container top'>
<a class='w3schools-logo' href='http://www.w3schools.com'>w3schools<span
class='dotcom'>.com</span></a>
<div class='w3-right toptext w3-wide'>THE WORLD'S LARGEST WEB DEVELOPER SITE</div>
</div>
<div style='display:none;position:absolute;z-index:4;right:52px;height:44px;background-color:#5f5f5f;letter-
spacing:normal;' id='googleSearch'>
<div class='gcse-search'></div>
</div>
<div style='display:none;position:absolute;z-index:3;right:111px;height:44px;background-color:#5f5f5f;textalign:right;padding-top:9px;' id='google_translate_element'></div>
<div class='w3-navbar w3-card-2 w3-slim topnav' id='topnav'>
<div style='overflow:auto;'>
<div style='float:left;width:50%;overflow:hidden;height:44px'>
<a href='javascript:void(0);' class='topnav-localicons w3-hide-large w3-left' onclick='open_menu()'
title='Menu'>☰</a>
<a href='/default.asp' class='topnav-icons fa fa-home w3-left' title='Home'></a>
<a href='/html/default.asp' class='w3-hide-small' title='HTML Tutorial'>HTML</a>
<a href='/css/default.asp' class='w3-hide-small' title='CSS Tutorial'>CSS</a>
<a href='/js/default.asp' class='w3-hide-small' title='JavaScript Tutorial'>JAVASCRIPT</a>
<a href='/sql/default.asp' class='w3-hide-small' title='SQL Tutorial'>SQL</a>
<a href='/php/default.asp' class='w3-hide-small' title='PHP Tutorial'>PHP</a>
<a href='/bootstrap/default.asp' class='w3-hide-small' title='Bootstrap Tutorial'>BOOTSTRAP</a>
<a href='/jquery/default.asp' class='w3-hide-small' title='jQuery Tutorial'>JQUERY</a>
<a href='/angular/default.asp' class='w3-hide-small' title='Angular Tutorial'>ANGULAR</a>
<a href='/xml/default.asp' class='w3-hide-small' title='XML Tutorial'>XML</a>
</div>
<div style='float:right;width:110px;overflow:hidden;height:44px;'>
<a href='javascript:void(0);' class='topnav-icons fa w3-right' onclick='open_search(this)'
style='position:relative;z-index:4;' title='Search W3Schools'></a>
<a href='javascript:void(0);' class='topnav-icons fa w3-right' onclick='open_translate(this)' title='Translate
W3Schools'></a></div>
<div class='w3-hide-small' style='float:right;width:30%;overflow:hidden;height:44px;'>
<a id='topnavbtn_tutorials' href='javascript:void(0);' onclick='w3_open_nav("tutorials")'
title='Tutorials'>TUTORIALS <i class='fa fa-caret-down'></i><i class='fa fa-caret-up'
style='display:none'></i></a>
<a id='topnavbtn_references' href='javascript:void(0);' onclick='w3_open_nav("references")'
title='References'>REFERENCES <i class='fa fa-caret-down'></i><i class='fa fa-caret-up'
<a id='topnavbtn_examples' href='javascript:void(0);' onclick='w3_open_nav("examples")'
title='Examples'>EXAMPLES <i class='fa fa-caret-down'></i><i class='fa fa-caret-up'
<a href='/forum/default.asp'>FORUM</a>
</div>
</div>
<div id='nav_tutorials' class='w3-dropnav w3-light-grey w3-card-2'></div>
<div id='nav_references' class='w3-dropnav w3-light-grey w3-card-2'></div>
<div id='nav_examples' class='w3-dropnav w3-light-grey w3-card-2'></div>
</div>
<div class='w3-sidenav w3-collapse w3-slim' id='sidenav'>
<div id='leftmenuinner'>
<div class='w3-light-grey' id='leftmenuinnerinner'>
<a href='javascript:void(0)' onclick='close_menu()' class='w3-closebtn w3-hide-large w3-large'
style='padding:3px 12px;'>×</a>
<h2 class="left"><span class="left_h2">HTML5</span> Tutorial</h2>
<a target="_top" href="default.asp">HTML HOME</a>
<a target="_top" href="html_intro.asp">HTML Introduction</a>
<a target="_top" href="html_editors.asp">HTML Editors</a>
<a target="_top" href="html_basic.asp">HTML Basic</a>
<a target="_top" href="html_elements.asp">HTML Elements</a>
<a target="_top" href="html_attributes.asp">HTML Attributes</a>
<a target="_top" href="html_headings.asp">HTML Headings</a>

<a target="_top" href="html_paragraphs.asp">HTML Paragraphs</a>
<a target="_top" href="html_styles.asp">HTML Styles</a>
<a target="_top" href="html_formatting.asp">HTML Formatting</a>
<a target="_top" href="html_quotation_elements.asp">HTML Quotations</a>
<a target="_top" href="html_computercode_elements.asp">HTML Computercode</a>
<a target="_top" href="html_comments.asp">HTML Comments</a>
<a target="_top" href="html_colors.asp">HTML Colors</a>
<a target="_top" href="html_css.asp">HTML CSS</a>
<a target="_top" href="html_links.asp">HTML Links</a>
<a target="_top" href="html_images.asp">HTML Images</a>
<a target="_top" href="html_tables.asp">HTML Tables</a>
<a target="_top" href="html_lists.asp">HTML Lists</a>
<a target="_top" href="html_blocks.asp">HTML Blocks</a>
<a target="_top" href="html_classes.asp">HTML Classes</a>
<a target="_top" href="html_iframe.asp">HTML Iframes</a>
<a target="_top" href="html_scripts.asp">HTML JavaScript</a>
<a target="_top" href="html_head.asp">HTML Head</a>
<a target="_top" href="html_layout.asp">HTML Layout</a>
<a target="_top" href="html_responsive.asp">HTML Responsive</a>
<a target="_top" href="html_entities.asp">HTML Entities</a>
<a target="_top" href="html_symbols.asp">HTML Symbols</a>
<a target="_top" href="html_charset.asp">HTML Charset</a>
<a target="_top" href="html_urlencode.asp">HTML URL Encode</a>
<a target="_top" href="html_xhtml.asp">HTML XHTML</a>
<br>
<h2 class="left"><span class="left_h2">HTML</span> Forms</h2>
<a target="_top" href="html_forms.asp">HTML Forms</a>
<a target="_top" href="html_form_elements.asp">HTML Form Elements</a>
<a target="_top" href="html_form_input_types.asp">HTML Input Types</a>
<a target="_top" href="html_form_attributes.asp">HTML Input Attributes</a>
<br>
<h2 class="left"><span class="left_h2">HTML5</span></h2>
<a target="_top" href="html5_intro.asp">HTML5 Intro</a>
<a target="_top" href="html5_browsers.asp">HTML5 Support</a>
<a target="_top" href="html5_new_elements.asp">HTML5 Elements</a>
<a target="_top" href="html5_semantic_elements.asp">HTML5 Semantics</a>
<a target="_top" href="html5_migration.asp">HTML5 Migration</a>
<a target="_top" href="html5_syntax.asp">HTML5 Style Guide</a>
<br>
<h2 class="left"><span class="left_h2">HTML</span> Graphics</h2>
<a target="_top" href="html5_canvas.asp">HTML Canvas</a>
<a target="_top" href="html5_svg.asp">HTML SVG</a>
<a target="_top" href="html_googlemaps.asp">HTML Google Maps</a>
<br>
<h2 class="left"><span class="left_h2">HTML</span> Media</h2>
<a target="_top" href="html_media.asp">HTML Media</a>
<a target="_top" href="html5_video.asp">HTML Video</a>
<a target="_top" href="html5_audio.asp">HTML Audio</a>
<a target="_top" href="html_object.asp">HTML Plug-ins</a>
<a target="_top" href="html_youtube.asp">HTML YouTube</a>
<br>
<h2 class="left"><span class="left_h2">HTML</span> APIs</h2>
<a target="_top" href="html5_geolocation.asp">HTML Geolocation</a>
<a target="_top" href="html5_draganddrop.asp">HTML Drag/Drop</a>
<a target="_top" href="html5_webstorage.asp">HTML Local Storage</a>
<a target="_top" href="html5_app_cache.asp">HTML App Cache</a>

<a target="_top" href="html5_webworkers.asp">HTML Web Workers</a>
<a target="_top" href="html5_serversentevents.asp">HTML SSE</a>
<br>
<h2 class="left"><span class="left_h2">HTML</span> Examples</h2>
<a target="_top" href="html_examples.asp">HTML Examples</a>
<a target="_top" href="html_quiz.asp">HTML Quiz</a>
<a target="_top" href="html_exam.asp">HTML Certificate</a>
<a target="_top" href="html_summary.asp">HTML Summary</a>
<br>
<h2 class="left"><span class="left_h2">HTML</span> References</h2>
<a target="_top" href="/tags/default.asp">HTML Tag List</a>
<a target="_top" href="/tags/ref_standardattributes.asp">HTML Attributes</a>
<a target="_top" href="/tags/ref_eventattributes.asp">HTML Events</a>
<a target="_top" href="/tags/ref_colornames.asp">HTML Colors</a>
<a target="_top" href="/tags/ref_canvas.asp">HTML Canvas</a>
<a target="_top" href="/tags/ref_av_dom.asp">HTML Audio/Video</a>
<a target="_top" href="/tags/ref_html_dtd.asp">HTML Doctypes</a>
<a target="_top" href="/tags/ref_charactersets.asp">HTML Character Sets</a>
<a target="_top" href="/tags/ref_urlencode.asp">HTML URL Encode</a>
<a target="_top" href="/tags/ref_language_codes.asp">HTML Lang Codes</a>
<a target="_top" href="/tags/ref_httpmessages.asp">HTTP Messages</a>
<a target="_top" href="/tags/ref_httpmethods.asp">HTTP Methods</a>
<a target="_top" href="/tags/ref_pxtoemconversion.asp">PX to EM Converter</a>
<a target="_top" href="/tags/ref_keyboardshortcuts.asp">Keyboard Shortcuts</a>
<br><br>
</div>
</div>
</div>
<div class='w3-main w3-light-grey' id='belowtopnav' style='margin-left:220px;'>
<div class='w3-row w3-white'>
<div class='w3-col l10 m12' id='main'>
<div id='mainLeaderboard' style='overflow:hidden;'>

<div id='div-gpt-ad-1422003450156-2'>
<script type='text/javascript'>googletag.cmd.push(function() { googletag.display('div-gpt-ad1422003450156-2'); });</script>
</div>
</div>
<h1>HTML <span class="color_h1">Examples</span></h1>
<div class="w3-clear nextprev">
<a class="w3-left w3-btn" href="html5_serversentevents.asp">❮ Previous</a>
<a class="w3-right w3-btn" href="html_quiz.asp">Next ❯</a>
</div>
<hr>
<p><b>HTML Basic</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_basic_document">HTML document</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_basic_headings">HTML headings</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_basic_paragraphs">HTML paragraphs</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_basic_link">HTML links</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_basic_img">HTML images</a>
</p>
<p><a href="html_basic.asp" class="w3-btn">Examples explained</a></p>

<hr>
<p><b>HTML Attributes</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_attributes_title">The title attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_attributes_link">The href attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_attributes_img">The width and height
attributes</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_attributes_alt">The alt attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_attributes_noquotes">Attribute without quotes</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_attributes_error">Attribute without quotes does not
work</a>
</p>
<p><a href="html_attributes.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Headings</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_headings">HTML headings</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_headings_hr">HTML horizontal rules</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_headings_head">HTML head</a>
</p>
<p><a href="html_headings.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Paragraphs</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_paragraphs1">HTML paragraphs</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_paragraphs2">More HTML paragraphs</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_paragraphs">The use of line breaks in HTML</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_poem">Poem problems (some problems with HTML
formatting)</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_pre">How to control the line breaks and spaces with the
<pre> tag</a>
</p>
<p><a href="html_paragraphs.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Styles</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_styles_intro">HTML styles</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_styles_background-color">HTML background
color</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_styles_color">HTML text color</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_styles_font-family">HTML text font</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_styles_font-size">HTML text size</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_styles_text-align">HTML text alignment</a><br>
</p>
<p><a href="html_styles.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Text Formatting</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_b">Bold formatting using the <b>
element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_strong">Strong formatting using the
<strong> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_i">Italic formatting using the <i>
element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_em">Emphasized formatting using the
<em> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_small">Small formatting using the
<small> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_mark">Marked formatting using the
<mark> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_del">Marked deleted using the <del>
element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_ins">Marked inserted using the <ins>
element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_del_ins">Marked deleted and inserted using
<del> and <ins></a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_sub">Subscript formatting using the
<sub> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_sup">Superscript formatting using the
<sup> element</a>
</p>
<p><a href="html_formatting.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Quotations and Citations</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_q">Formatting short quotations with the
<q> element.</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_blockquote">Formatting quoted sections
with the <blockquote> element.</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_address">Formatting document
author/owner information with the <address> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_abbr">Formatting abbreviations and
acronyms the <abbr> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_cite">Formatting work title with the
<cite> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_bdo">Formatting text direction with the
<bdo> element</a>
</p>
<p><a href="html_quotation_elements.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Computercode Elements</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_kbd">Keyboard input formatting using the
<kbd> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_samp">Computer output formatting using
the <samp> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_code">Programming code formatting using
the <code> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_codepre">Programming code formatting
preserving whitespace and line-breaks</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_formatting_var">Variable formatting using the
<var> element</a>
</p>
<p><a href="html_computercode_elements.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Comments</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_comment">Hidden comments</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_ie_conditional">Conditional comments</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_comment_out">Comments for debugging</a>
</p>
<p><a href="html_comments.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML CSS</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_inline">HTML with inline CSS</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_internal">HTML with internal CSS</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_external">HTML with external CSS</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_fonts">HTML with CSS fonts</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_id">HTML with CSS using the id
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_class">HTML with CSS using the class
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_borders">HTML and CSS borders</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_padding">HTML and CSS padding</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_margin">HTML and CSS margin</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_css_full">HTML and CSS full demo</a>
</p>
<p><a href="html_css.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Links</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_w3schools">Linking, using an absolute
URL</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links">Linking, using a relative URL</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_colors">Changing the color of links</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_noline">Removing the underline from
links</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_target">Changing the target of a link</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_image">An image as a link</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_bookmark">Creating a bookmark link</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_target_top">A link that breaks out of a
frame</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_mailto">A mailto link</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_links_mailto_subject">A mailto link with subject</a>
</p>
<p><a href="html_links.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Images</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_mountain">The Mountain</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_attributes">An image height and width using
attributes</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_size">An image height and width using
CSS</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_style">An image height and width using
both</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_folder">An image in another folder</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_wrong">An image with a broken link</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_w3schools">An image on another
server</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_link">Using an image as a link</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_hackman">A moving image</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_map">An image map with clickable
regions</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_images_float">A floating image</a>
</p>
<p><a href="html_images.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Tables</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_basic">Basic HTML tables</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_border">A table with borders</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_collapse">A table with collapsed
borders</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_cellpadding">A table with cell padding</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_headings">A table with headings</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_headings_left">A table with left-aligned
headings</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_headers">Horizontal/Vertical table
headings</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_tables2">A table with a caption</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_colspan">Table cells that span more than one
column</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_rowspan">Table cells that span more than one
row</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_cellspacing">A table with cell spacing</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_elements">A table with HTML tags
inside</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_id1">Tables with different style using id
I</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_id2">Tables with different style using id
II</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_class1">Tables with different style using class
I</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_table_class2">Tables with different style using class
II</a>
</p>
<p><a href="html_tables.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Lists</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_unordered">An unordered list (default)</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_unordered_disc">An unordered list with disc
bullets</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_unordered_circle">An unordered list with circle
bullets</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_unordered_square">An unordered list with square
bullets</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_unordered_none">An unordered list without
bullets</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered">An ordered list (default)</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered_numbers">An ordered list with
numbers</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered_ucase">An ordered list with
letters</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered_lcase">An ordered list with lowercase

letters</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered_roman_ucase">An ordered list with
roman numbers</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered_roman_lcase">An ordered list with
lowercase roman numbers</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_description">A description list</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_nested">A nested list I</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_nested2">A nested list II</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_horizontal">A horizontal list</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_lists_menu">A horizontal list menu</a>
</p>
<p><a href="html_lists.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Block and inline elements</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_div_capitals">Styling <div> elements</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_span_red">Styling <span> elements</a>
<p><a href="html_blocks.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Classes</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_classes_london">Classing <div> elements
I</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_classes_capitals">Classing <div> elements
II</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_classes_span">Classing <span> elements</a>
<p><a href="html_classes.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Layout</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_layout_float">Layout using float</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_layout_flexbox">Layout using flexbox</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_layout_flexbox2">Layout using flexbox 2</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_layout_flexbox3">Layout using flexbox 3</a>
</p>
<p><a href="html_layout.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML IFrame</b></p>
<p><a target="_blank" href="tryit.asp?filename=tryhtml_iframe">Inline frame (a frame inside an HTML
page)</a></p>
<p><a href="html_iframe.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML head Elements</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_none">A valid HTML document with no
<html> <body, and <head></a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_no_head">A valid HTML document with no
<head> element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_title">The <title> element defines the
document title</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_style">The <style> element contains style
information</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_link">The <link> element defines a
relationship to an external resource</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_meta">The <meta> element defines special
meta information</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_script">The <script> element defines clientside JavaScripts</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_head_base">The <base> element defines the base
URL for all URLs</a>
</p>
<p><a href="html_head.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Scripts</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_script">Insert a script</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_noscript">Use of the <noscript> tag</a>
</p>
<p><a href="html_scripts.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Forms</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_form_text">Form with text input</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_form_radio">Form with radio button input</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_form_submit">Form with text fields and a submit
button</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_form_submit_id">Form with a text fields without a
name attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_form_legend">Grouping Form Data</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_form_mail">Send e-mail from a form</a>
</p>
<p><a href="html_forms.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Form Elements</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_select">A simple drop-down list</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_select_pre">A drop-down list with a pre-selected
value</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_textarea">A textarea (a multi-line text input
field)</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_button">An input button</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_datalist">Using the <datalist>
Element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_keygen">Using the <keygen>
Element</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_elem_output">Using the <output> Element</a>
</p>
<p><a href="html_form_elements.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Input Types</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_text">Input type text</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_password">Input type password</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_radio">Input type radio</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_checkbox">Input type checkbox</a><br>

<a target="_blank" href="tryit.asp?filename=tryhtml_input_button">Input type button</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_number">Input type number - with
restrictions</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_number_step">Input type number - with
steps</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_date">Input type date - with date picker</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_date_max_min">Input type date - with
restrictions</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_color">Input type color - with color
picker</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_range">Input type range</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_month">Input type month</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_week">Input type week</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_time">Input type time</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_datetime">Input type datetime</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_datetime-local">Input type datetimelocal</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_email">Input type email</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_search">Input type search</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_tel">Input type tel</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_input_url">Input type url<br>
</p>
<p><a href="html_form_input_types.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML Input Attributes</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_autocomplete">The autocomplete
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_form_novalidate">The novalidate attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_autofocus">The autofocus_attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_form">The form attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_formaction">The formaction attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_formenctype">The formenctype
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_formmethod">The formmethod
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_formnovalidate">The formnovalidate
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_formtarget">The formtarget attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_height_width">The height and width
attributes</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_list">The list attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_max_min">The min and max
attributes</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_multiple">The multiple attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_pattern">The pattern attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_placeholder">The placeholder
attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_required">The required attribute</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_input_step">The step attribute</a>
</p>
<p><a href="html_form_attributes.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML5 Canvas</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_first">Draw on the canvas with
JavaScript</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_path">Draw a line with lineTo()</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_path2">Draw a circle with arc()</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_text">Draw a text with fillText()</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_text2">Draw a text with
strokeText()</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_grad">Draw a linear gradient</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_grad2">Draw a circular gradient</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_canvas_tut_img">Draw an image with
drawImage()</a>
</p>
<p><a href="html5_canvas.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML5 SVG</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml_svg_circle">SVG Circle</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_svg_rect">SVG Rectangle</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_svg_rect_round">SVG Rounded Rectangle</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_svg_star">SVG Star</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml_svg_logo">SVG Logo</a>
</p>
<p><a href="html5_svg.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML5 Media</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml5_video">Play Bunny</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_video_all">Play bear video with controls</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_video_autoplay">Play bear video with
autoplay</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_audio_all">Play Horse sound with controls</a>
</p>
<p><a href="html_media.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML5 Geolocation</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml5_geolocation">Get geolocation coordinates</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_geolocation_error">Handle geolocation
errors</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_geolocation_map">Get geolocation with a
map</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_geolocation_map_script">Get geolocation with
Google map script</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_geolocation_watchposition">Get geolocation and
watch the position</a>
</p>
<p><a href="html5_geolocation.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>HTML5 Local Storage</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml5_webstorage_local">Store a name
permanently</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_webstorage_local_clickcount">Store a counter

permanently</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_webstorage_session">Store a counter for one
session</a>
</p>
<p><a href="html5_webstorage.asp" class="w3-btn">Examples explained</a></p>
<hr>
<p><b>More HTML5 Examples</b></p>
<p>
<a target="_blank" href="tryit.asp?filename=tryhtml5_draganddrop">HTML5 drag and drop</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_html_manifest">HTML5 application cache</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_webworker">HTML5 web workers</a><br>
<a target="_blank" href="tryit.asp?filename=tryhtml5_sse">HTML5 server sent events</a>
</p>
<br>
<div class="w3-clear nextprev">
<a class="w3-left w3-btn" href="html5_serversentevents.asp">❮ Previous</a>
<a class="w3-right w3-btn" href="html_quiz.asp">Next ❯</a>
</div>
</div>
<div class="w3-col l2 m12" id="right">
<div class="sidesection">
<div id="skyscraper">
<div id="div-gpt-ad-1422003450156-5">
<script>
googletag.cmd.push(function() {
googletag.display('div-gpt-ad-1422003450156-5');
});
</script>
</div>
</div>
</div>
<h4><a href="/colors/colors_picker.asp">COLOR PICKER</a></h4>
<a href="/colors/colors_picker.asp">
<img src="/images/colorpicker.gif" alt="colorpicker"></a>
</div>
<h4><a href="/howto/default.asp">LEARN MORE</a></h4>
<p>
<a href="/howto/howto_css_cards.asp">HTML Cards</a><br>
<a href="/howto/howto_google_maps.asp">Google Maps</a><br>
<a href="/howto/howto_css_animate_buttons.asp">Animated Buttons</a><br>
<a href="/howto/howto_css_modals.asp">Modal Boxes</a><br>
<a href="/howto/howto_css_modal_images.asp">Modal Images</a><br>
<a href="/howto/howto_css_tooltip.asp">Tooltips</a><br>
<a href="/howto/howto_css_loader.asp">Loaders</a><br>
<a href="/howto/howto_js_filter_lists.asp">Filter List</a><br>
<a href="/howto/howto_js_animate.asp">JS Animations</a><br>
<a href="/howto/howto_js_progressbar.asp">Progress Bars</a><br>
<a href="/howto/howto_js_dropdown.asp">Dropdowns</a><br>
<a href="/howto/howto_js_slideshow.asp">Slideshow</a><br>
<a href="/howto/howto_js_accordion.asp">Accordions</a><br>
<a href="/howto/howto_js_sidenav.asp">Side Navigation</a><br>
<a href="/howto/howto_js_topnav.asp">Top Navigation</a><br>
<a href="/howto/howto_html_include.asp">HTML Includes</a><br>
<a href="/howto/howto_js_tabs.asp">Tabs</a><br>
</p>
</div>
<h4>SHARE</h4>
<div class="w3-text-grey sharethis">
<script>
<!-try{
loc=location.pathname;
if (loc.toUpperCase().indexOf(".ASP")<0) loc=loc+"default.asp";
txt='<a href="http://www.facebook.com/sharer.php?u=http://www.w3schools.com'+loc+'" target="_blank"
title="Facebook"><span class="fa fa-facebook-square fa-2x"></span></a>';
txt=txt+'<a href="http://twitter.com/home?status=Currently reading http://www.w3schools.com'+loc+'"
target="_blank" title="Twitter"><span class="fa fa-twitter-square fa-2x"></span></a>';
txt=txt+'<a href="https://plus.google.com/share?url=http://www.w3schools.com'+loc+'" target="_blank"
title="Google+"><span class="fa fa-google-plus-square fa-2x"></span></a>';
document.write(txt);
} catch(e) {}
//-->
</script>
<br><br>
<a href="javascript:void(0);" onclick="clickFBLike()" title="Like W3Schools on Facebook">
<span class="fa fa-thumbs-o-up fa-2x"></span></a>
<div id="fblikeframe" class="w3-modal">
<div class="w3-modal-content w3-padding-64 w3-animate-zoom" id="popupDIV"></div>
</div>
</div>
</div>
<h4><a target="_blank" href="http://www.w3schools.com/cert/default.asp">CERTIFICATES</a></h4>
<p>HTML, CSS, JavaScript, PHP, jQuery, Bootstrap and XML.</p>
<a target="_blank" href="http://www.w3schools.com/cert/default.asp" class="w3-btn w3-dark-grey">
Read More »</a>
</div>
<div id="stickypos" class="sidesection" style="text-align:center;">
<div id="stickyadcontainer">
<div style="position:relative;margin:auto;">
<div id='div-gpt-ad-1472547360578-0'>
<script>
if (Number(w3_getStyleValue(document.getElementById("main"), "height").replace("px", "")) > 2200) {
googletag.cmd.push(function() { googletag.display('div-gpt-ad-1472547360578-0'); });
window.addEventListener("scroll", fix_stickyad);
window.addEventListener("resize", fix_stickyad);
}
</script>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="footer" class="footer w3-container w3-white">
<hr>
<div style="overflow:auto">

<div class="bottomad" id='div-gpt-ad-1422003450156-0'>
</script>
</div>

<div class="bottomad" id='div-gpt-ad-1422003450156-3'>
</script>
</div>
</div>
<hr>
<div class="w3-row w3-center w3-small">
<div class="w3-col l3 m3 s12">
<a href="javascript:void(0);" onclick="displayError();return false" style="white-space:nowrap;">REPORT
ERROR</a>
</div>
<a href="" target="_blank" onclick="printPage();return false;">PRINT PAGE</a>
</div>
<a href="/forum/default.asp" target="_blank">FORUM</a>
</div>
<a href="/about/default.asp" target="_top">ABOUT</a>
</div>
</div>
<hr>
<div class="w3-light-grey w3-padding w3-center" id="err_form" style="display:none;">
<span onclick="this.parentElement.style.display='none'" class="w3-closebtn">×</span>
<h2>Your Suggestion:</h2>
<form>
<div class="w3-group">
<label for="err_email">Your E-mail:</label>
<input class="w3-input" type="text" style="width:100%" id="err_email" name="err_email">
</div>
<label for="err_email">Page address:</label>
<input class="w3-input" type="text" style="width:100%" id="err_url" name="err_url" disabled="disabled">
</div>
<label for="err_email">Description:</label>
<textarea rows="10" class="w3-input" id="err_desc" name="err_desc" style="width:100%;"></textarea>
</div>
<div class="form-group">
<button type="button" onclick="sendErr()">Submit</button>
</div>
<br>
</form>
</div>
<div class="w3-container w3-light-grey w3-padding" id="err_sent" style="display:none;">
<span onclick="this.parentElement.style.display='none'" class="w3-closebtn">×</span>
<h2>Thank You For Helping Us!</h2>
<p>Your message has been sent to W3Schools.</p>
</div>
<div class="w3-row w3-center w3-small">
<div class="top10">
<h4>Top 10 Tutorials</h4>
<a href="/html/default.asp">HTML Tutorial</a><br>
<a href="/css/default.asp">CSS Tutorial</a><br>
<a href="/js/default.asp">JavaScript Tutorial</a><br>
<a href="/w3css/default.asp">W3.CSS Tutorial</a><br>
<a href="/bootstrap/default.asp">Bootstrap Tutorial</a><br>
<a href="/sql/default.asp">SQL Tutorial</a><br>
<a href="/php/default.asp">PHP Tutorial</a><br>
<a href="/jquery/default.asp">jQuery Tutorial</a><br>
<a href="/angular/default.asp">Angular Tutorial</a><br>
<a href="/xml/default.asp">XML Tutorial</a><br>
</div>
</div>
<div class="top10">
<h4>Top 10 References</h4>
<a href="/tags/default.asp">HTML Reference</a><br>
<a href="/cssref/default.asp">CSS Reference</a><br>
<a href="/jsref/default.asp">JavaScript Reference</a><br>
<a href="/w3css/w3css_references.asp">W3.CSS Reference</a><br>
<a href="/browsers/default.asp">Browser Statistics</a><br>
<a href="/php/php_ref_array.asp">PHP Reference</a><br>
<a href="/colors/colors_names.asp">HTML Colors</a><br>
<a href="/charsets/default.asp">HTML Character Sets</a><br>
<a href="/jquery/jquery_ref_selectors.asp">jQuery Reference</a><br>
<a href="/angular/angular_ref_directives.asp">AngularJS Reference</a><br>
</div>
</div>
<div class="top10">
<h4>Top 10 Examples</h4>
<a href="/html/html_examples.asp">HTML Examples</a><br>
<a href="/css/css_examples.asp">CSS Examples</a><br>
<a href="/js/js_examples.asp">JavaScript Examples</a><br>
<a href="/w3css/w3css_examples.asp">W3.CSS Examples</a><br>
<a href="/js/js_dom_examples.asp">HTML DOM Examples</a><br>
<a href="/php/php_examples.asp">PHP Examples</a><br>
<a href="/asp/asp_examples.asp">ASP Examples</a><br>
<a href="/jquery/jquery_examples.asp">jQuery Examples</a><br>
<a href="/angular/angular_examples.asp">Angular Examples</a><br>
<a href="/xml/xml_examples.asp">XML Examples</a><br>
</div>
</div>
<div class="top10">
<h4>Web Certificates</h4>
<a href="/cert/default.asp">HTML Certificate</a><br>
<a href="/cert/default.asp">HTML5 Certificate</a><br>
<a href="/cert/default.asp">CSS Certificate</a><br>
<a href="/cert/default.asp">JavaScript Certificate</a><br>
<a href="/cert/default.asp">jQuery Certificate</a><br>
<a href="/cert/default.asp">PHP Certificate</a><br>
<a href="/cert/default.asp">Bootstrap Certificate</a><br>
<a href="/cert/default.asp">XML Certificate</a><br>
</div>
</div>
</div>
<hr>
<div class="w3-center w3-small w3-opacity">
W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading
and basic understanding.
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full
correctness of all content.
While using this site, you agree to have read and accepted our <a href="/about/about_copyright.asp">terms of
use</a>,
<a href="/about/about_privacy.asp">cookie and privacy policy</a>.
<a href="/about/about_copyright.asp">Copyright 1999-2016</a> by Refsnes Data. All Rights Reserved.<br>
<a href="http://www.w3schools.com/w3css/">Powered by W3.CSS</a>.<br><br>
<a href="http://www.w3schools.com">
<img style="width:150px;height:28px;border:0" src="/images/w3schoolscom_gray.gif"
alt="W3Schools.com"></a>
</div>
<br><br>
</div>
</div>
<div id="nav_tutorials_content" style="display:none;">
<span onclick='w3_close_nav("tutorials")' class='w3-closebtn w3-xlarge w3-hover-textgrey'>×</span>
<br>
<div class='w3-row-padding'>
<div class='w3-col m4'>
<h3>HTML and CSS</h3>
<a href='/html/default.asp'>Learn HTML</a>
<a href='/css/default.asp'>Learn CSS</a>
<a href='/w3css/default.asp'>Learn W3.CSS</a>
<a href='/colors/default.asp'>Learn Colors</a>
<a href='/bootstrap/default.asp'>Learn Bootstrap</a>
<a href='/graphics/default.asp'>Learn Graphics</a>
<a href='/icons/default.asp'>Learn Icons</a>
<a href='/howto/default.asp'>Learn How To</a>
</div>
<h3>JavaScript</h3>
<a href='/js/default.asp'>Learn JavaScript</a>
<a href='/jquery/default.asp'>Learn jQuery</a>

<a href='/jquerymobile/default.asp'>Learn jQueryMobile</a>
<a href='/appml/default.asp'>Learn AppML</a>
<a href='/angular/default.asp'>Learn AngularJS</a>
<a href='/json/default.asp'>Learn JSON</a>
<a href='/ajax/default.asp'>Learn AJAX</a>
<h3>XML</h3>
<a href='/xml/default.asp'>Learn XML</a>
<a href='/xsl/default.asp'>Learn XSLT</a>
<a href='/xsl/xpath_intro.asp'>Learn XPath</a>
<a href='/xsl/xquery_intro.asp'>Learn XQuery</a>
</div>
<h3>Server Side</h3>
<a href='/sql/default.asp'>Learn SQL</a>
<a href='/php/default.asp'>Learn PHP</a>
<a href='/asp/default.asp'>Learn ASP</a>
<h3>Web Building</h3>
<a href="/w3css/w3css_templates.asp">Web Templates</a>
<a href='/browsers/default.asp'>Web Statistics</a>
<a href='/cert/default.asp'>Web Certificates</a>
</div>
</div>
<br>
</div>
<div id="nav_references_content" class="w3-padding-bottom" style="display:none;">
<span onclick='w3_close_nav("references")' class='w3-closebtn w3-xlarge w3-hover-textgrey'>×</span>
<br>
<h3>HTML</h3>
<a href='/tags/default.asp'>HTML Tag Reference</a>
<a href='/tags/ref_eventattributes.asp'>HTML Event Reference</a>
<a href='/colors/default.asp'>HTML Color Reference</a>
<a href='/tags/ref_attributes.asp'>HTML Attribute Reference</a>
<a href='/tags/ref_canvas.asp'>HTML Canvas Reference</a>
<a href='/graphics/svg_reference.asp'>HTML SVG Reference</a>
<a href='/graphics/google_maps_reference.asp'>Google Maps Reference</a>
<h3>CSS</h3>
<a href='/cssref/default.asp'>CSS Reference</a>
<a href='/cssref/css_selectors.asp'>CSS Selector Reference</a>
<a href='/w3css/w3css_references.asp'>W3.CSS Reference</a>
<a href='/bootstrap/bootstrap_ref_css_text.asp'>Bootstrap Reference</a>
</div>
<h3>JavaScript</h3>
<a href='/jsref/default.asp'>JavaScript Reference</a>
<a href='/jsref/default.asp'>HTML DOM Reference</a>
<a href='/jquery/jquery_ref_selectors.asp'>jQuery Reference</a>
<a href='/jquerymobile/jquerymobile_ref_data.asp'>jQuery Mobile Reference</a>
<a href='/angular/angular_ref_directives.asp'>AngularJS Reference</a>
<h3>XML</h3>
<a href='/xml/dom_nodetype.asp'>XML Reference</a>
<a href='/xsl/xsl_w3celementref.asp'>XSLT Reference</a>
<a href='/xml/schema_elements_ref.asp'>XML Schema Reference</a>
</div>
<h3>Charsets</h3>
<a href='/charsets/default.asp'>HTML Character Sets</a>
<a href='/charsets/ref_html_ascii.asp'>HTML ASCII</a>
<a href='/charsets/ref_html_ansi.asp'>HTML ANSI</a>
<a href='/charsets/ref_html_ansi.asp'>HTML Windows-1252</a>
<a href='/charsets/ref_html_8859.asp'>HTML ISO-8859-1</a>
<a href='/charsets/ref_html_symbols.asp'>HTML Symbols</a>
<a href='/charsets/ref_html_utf8.asp'>HTML UTF-8</a>
<a href='/php/php_ref_array.asp'>PHP Reference</a>
<a href='/sql/sql_quickref.asp'>SQL Reference</a>
<a href='/asp/asp_ref_response.asp'>ASP Reference</a>
</div>
</div>
<br>
</div>
<div id="nav_examples_content" style="display:none;">
<span onclick='w3_close_nav("examples")' class='w3-closebtn w3-xlarge w3-hover-textgrey'>×</span>
<br>
<h3>HTML/CSS</h3>
<a href='/html/html_examples.asp'>HTML Examples</a>
<a href='/css/css_examples.asp'>CSS Examples</a>
<a href='/w3css/w3css_examples.asp'>W3.CSS Examples</a>
<h3>JavaScript</h3>
<a href='/js/js_examples.asp' target='_top'>JavaScript Examples</a>
<a href='/js/js_dom_examples.asp' target='_top'>HTML DOM Examples</a>
<a href='/jquery/jquery_examples.asp' target='_top'>jQuery Examples</a>
<a href='/jquerymobile/jquerymobile_examples.asp' target='_top'>jQuery Mobile Examples</a>
<a href='/angular/angular_examples.asp' target='_top'>AngularJS Examples</a>
<a href='/ajax/ajax_examples.asp' target='_top'>AJAX Examples</a>
</div>
<h3>XML</h3>
<a href='/xml/xml_examples.asp' target='_top'>XML Examples</a>
<a href='/xsl/xsl_examples.asp' target='_top'>XSL Examples</a>
<a href='/xsl/xsl_examples.asp' target='_top'>XSLT Examples</a>
<a href='/xsl/xpath_examples.asp' target='_top'>XPath Examples</a>
<a href='/xml/schema_example.asp' target='_top'>XML Schema Examples</a>
<a href='/graphics/svg_examples.asp' target='_top'>SVG Examples</a>
<a href='/php/php_examples.asp' target='_top'>PHP Examples</a>
<a href="/asp/asp_examples.asp" target="_top">ASP Examples</a>
</div>
<h3>Quizzes</h3>
<a href='/quiztest/quiztest.asp?Qtest=HTML' target='_top'>HTML Quiz</a>
<a href='/quiztest/quiztest.asp?Qtest=CSS' target='_top'>CSS Quiz</a>
<a href='/quiztest/quiztest.asp?Qtest=JavaScript' target='_top'>JavaScript Quiz</a>
<a href='/quiztest/quiztest.asp?Qtest=Bootstrap' target='_top'>Bootstrap Quiz</a>
<a href='/quiztest/quiztest.asp?Qtest=jQuery' target='_top'>jQuery Quiz</a>
<a href='/quiztest/quiztest.asp?Qtest=PHP' target='_top'>PHP Quiz</a>
<a href="/quiztest/quiztest.asp?Qtest=SQL" target="_top">SQL Quiz</a>

<a href='/quiztest/quiztest.asp?Qtest=XML' target='_top'>XML Quiz</a>
</div>
</div>
<br>
</div>
<script src="/lib/w3schools_footer.js"></script>
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

</body>
</html>

DOCTYPE HTML

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

DOCTYPE HTML

Transféré par

Droits d'auteur :

Formats disponibles

<!

addSize([1135, 0], [728, 90]).

<a target="_top" href="html_headings.asp">HTML Headings</a>

<a target="_top" href="html5_app_cache.asp">HTML App Cache</a>

<p><a href="html_basic.asp" class="w3-btn">Examples explained</a></p>

<a target="_blank" href="tryit.asp?filename=tryhtml_lists_ordered_lcase">An ordered list with lowercase

<a target="_blank" href="tryit.asp?filename=tryhtml_input_checkbox">Input type checkbox</a><br>

<a target="_blank" href="tryit.asp?filename=tryhtml5_webstorage_local_clickcount">Store a counter

<a href='/jquery/default.asp'>Learn jQuery</a>

<a href="/quiztest/quiztest.asp?Qtest=SQL" target="_top">SQL Quiz</a>

Vous aimerez peut-être aussi