Reading...
Play button
Play button
Use LEFT and RIGHT arrow keys to navigate between flashcards;
Use UP and DOWN arrow keys to flip the card;
H to show hint;
A reads text to speech;
64 Cards in this Set
- Front
- Back
|
<!DOCTYPE>
|
The doctype declaration should be the very first thing in an HTML document, before the <html> tag.
The doctype declaration is not an HTML tag; it is an instruction to the web browser about what version of the markup language the page is written in. The doctype declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers can render the content correctly. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> |
|
|
<a> - two ways to use
|
The <a> tag defines an anchor. An anchor can be used in two ways:
To create a link to another document, by using the href attribute To create a bookmark inside a document, by using the name attribute The a element is usually referred to as a link or a hyperlink. The most important attribute of the a element is the href attribute, which indicates the link’s destination. By default, links will appear as follows in all browsers: An unvisited link is underlined and blue A visited link is underlined and purple An active link is underlined and red <a href="http://www.w3schools.com">Visit W3Schools.com!</a> |
|
|
<abbr>
|
The <abbr> tag describes an abbreviated phrase.
By marking up abbreviations you can give useful information to browsers, spellcheckers, screen readers, translation systems and search-engines. The <abbr title="World Health Organization">WHO</abbr> was founded in 1948. |
|
|
<acronym>
|
The <acronym> tag defines an acronym.
An acronym can be spoken as if it were a word, example NATO, NASA, ASAP, GUI. By marking up acronyms you can give useful information to browsers, spellcheckers, screen readers, translation systems and search-engines. Can I get this <acronym title="as soon as possible">ASAP</acronym>? |
|
|
<applet>
|
The <applet> tag defines an embedded applet.
<applet code="Bubbles.class" width="350" height="350"> Java applet that draws animated bubbles. </applet> |
|
|
<area>
|
The <area> tag defines an area inside an image-map (an image-map is an image with clickable areas).
The area element is always nested inside a <map> tag. Note: The usemap attribute in the <img> tag is associated with the map element's name attribute, and creates a relationship between the image and the map. <img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap" /> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" /> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury" /> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus" /> </map> |
|
|
<tt> <i> <b> <big> <small>
|
The <tt>, <i>, <b>, <big>, and <small> tags are all font-style tags. They are not deprecated, but it is possible to achieve richer effect with CSS.
Tag Description <i> Renders as italic text <b> Renders as bold text <big> Renders as bigger text <small> Renders as smaller text <tt>Teletype text</tt> <i>Italic text</i> <b>Bold text</b> <big>Big text</big> <small>Small text</small> |
|
|
The <base> tag
|
The <base> tag specifies a default address or a default target for all links on a page.
The <base> tag goes inside the head element. <head> <base href="http://www.w3schools.com/images/" /> <base target="_blank" /> </head> <body> <img src="stickman.gif" /> <a href="http://www.w3schools.com">W3Schools</a> </body> |
|
|
<basefont>
|
The <basefont> tag specifies a default font-color, font-size, or font-family for all the text in a document.
<head> <basefont color="red" size="5" /> </head> <body> <h1>This is a header</h1> <p>This is a paragraph</p> </body> |
|
|
<blockquote>
|
The <blockquote> tag defines a long quotation.
A browser inserts white space before and after a blockquote element. It also insert margins for the blockquote element. <blockquote> Here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation. </blockquote> |
|
|
<body>
|
The body element defines the document's body.
The body element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc. <html> <head> <title>Title of the document</title> </head> <body> The content of the document...... </body> </html> |
|
|
<br>
|
The <br> tag inserts a single line break.
The <br> tag is an empty tag which means that it has no end tag. This text contains<br />a line break. |
|
|
<button>
|
The <button> tag defines a push button.
Inside a button element you can put content, like text or images. This is the difference between this element and buttons created with the input element. Always specify the type attribute for the button. The default type for Internet Explorer is "button", while in other browsers (and in the W3C specification) it is "submit". <button type="button">Click Me!</button> |
|
|
standard attributes of <button>
|
ccesskey character Specifies a keyboard shortcut to access an element STF
class classname Specifies a classname for an element STF dir rtl ltr Specifies the text direction for the content in an element STF id id Specifies a unique id for an element STF lang language_code Specifies a language code for the content in an element STF style style_definition Specifies an inline style for an element STF tabindex number Specifies the tab order of an element STF title text Specifies extra information about an element STF xml:lang language_code Specifies a language code for the content in an element, in XHTML documents |
|
|
optional attributes of <button>
|
DTD indicates in which HTML 4.01/XHTML 1.0 DTD the attribute is allowed. S=Strict, T=Transitional, and F=Frameset.
Attribute Value Description DTD disabled disabled Specifies that a button should be disabled STF name name Specifies the name for a button STF type button reset submit Specifies the type of a button STF value text Specifies the underlying value of a button STF |
|
|
<caption>
|
The <caption> tag defines a table caption.
The <caption> tag must be inserted immediately after the <table> tag. You can specify only one caption per table. Usually the caption will be centered above the table. <table border="1"> <caption>Monthly savings</caption> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table> |
|
|
<center>
|
The <center> tag is used to center text.
<center>This text will be centered.</center> |
|
|
<em> <strong> <dfn> <code> <samp> <kbd> <var> <cite>
|
The <em>, <strong>, <dfn>, <code>, <samp>, <kbd>, <var>, and <cite> tags are all phrase tags. They are not deprecated, but it is possible to achieve richer effect with CSS.
<em>Emphasized text</em> <strong>Strong text</strong> <dfn>Definition term</dfn> <code>Computer code text</code> <samp>Sample computer code text</samp> <kbd>Keyboard text</kbd> <var>Variable</var> <cite>Citation</cite> |
|
|
<label>
|
The <label> tag defines a label for an input element.
The label element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the label element, it toggles the control. The for attribute of the <label> tag should be equal to the id attribute of the related element to bind them together. <form> <label for="male">Male</label> <input type="radio" name="sex" id="male" /> <br /> <label for="female">Female</label> <input type="radio" name="sex" id="female" /> </form> |
|
|
<legend>
|
The <legend> tag defines a caption for the fieldset element.
<form> <fieldset> <legend>Personalia:</legend> Name: <input type="text" size="30" /><br /> Email: <input type="text" size="30" /><br /> Date of birth: <input type="text" size="10" /> </fieldset> </form> |
|
|
<col>
|
The <col> tag defines attribute values for one or more columns in a table.
The <col> tag is useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row. The <col> tag can only be used inside a table or a colgroup element. <table width="100%" border="1"> <col align="left" /> <col align="left" /> <col align="right" /> <tr> <th>ISBN</th> <th>Title</th> <th>Price</th> </tr> <tr> <td>3476896</td> <td>My first HTML</td> <td>$53</td> </tr> </table> |
|
|
<colgroup>
|
The <colgroup> tag is used to group columns in a table for formatting.
The <colgroup> tag is useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row. The <colgroup> tag can only be used inside a table element. <table width="100%" border="1"> <colgroup span="2" align="left"></colgroup> <colgroup align="right" style="color:#0000FF;"></colgroup> <tr> <th>ISBN</th> <th>Title</th> <th>Price</th> </tr> <tr> <td>3476896</td> <td>My first HTML</td> <td>$53</td> </tr> </table> |
|
|
The <dd> tag
|
The <dd> tag is used to describe an item in a definition list.
The <dd> tag is used in conjunction with <dl> (defines the definition list) and <dt> (defines the item in the list). Inside a <dd> tag you can put paragraphs, line breaks, images, links, lists, etc. <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl> |
|
|
<del>
|
The <del> tag defines text that has been deleted from a document.
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p> |
|
|
<dir>
|
The <dir> tag is used to list directory titles.
<dir> <li>html</li> <li>xhtml</li> <li>css</li> </dir> |
|
|
<div>
|
The <div> tag defines a division or a section in an HTML document.
The <div> tag is often used to group block-elements to format them with styles. <div style="color:#00FF00"> <h3>This is a header</h3> <p>This is a paragraph.</p> </div> |
|
|
<dl>
|
The <dl> tag defines a definition list.
The <dl> tag is used in conjunction with <dt> (defines the item in the list) and <dd> (describes the item in the list). <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl> |
|
|
<dl>
|
The <dl> tag defines a definition list.
The <dl> tag is used in conjunction with <dt> (defines the item in the list) and <dd> (describes the item in the list). <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl> |
|
|
<dt>
|
The <dt> tag defines an item in a definition list.
The <dt> tag is used in conjunction with <dl> (defines the definition list) and <dd> (describes the item in the list). <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl> |
|
|
<fieldset>
|
The <fieldset> tag is used to logically group together elements in a form.
The <fieldset> tag draws a box around the related form elements. The <legend> tag defines a caption for the fieldset element. <form> <fieldset> <legend>Personalia:</legend> Name: <input type="text" size="30" /><br /> Email: <input type="text" size="30" /><br /> Date of birth: <input type="text" size="10" /> </fieldset> </form> |
|
|
<form>
|
The <form> tag is used to create an HTML form for user input.
A form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A forms can also contain select menus, textarea, fieldset, legend, and label elements. Forms are used to pass data to a server. <form action="form_action.asp" method="get"> First name: <input type="text" name="fname" /><br /> Last name: <input type="text" name="lname" /><br /> <input type="submit" value="Submit" /> </form> |
|
|
<frame>
|
The <frame> tag defines one particular window (frame) within a frameset.
Each frame in a frameset can have different attributes, such as border, scrolling, the ability to resize, etc. <html> <frameset cols="25%,50%,25%"> <frame src="frame_a.htm" /> <frame src="frame_b.htm" /> <frame src="frame_c.htm" /> </frameset> </html> |
|
|
<frameset>
|
The <frameset> tag defines a frameset.
The frameset element holds two or more frame elements. Each frame element holds a separate document. The frameset element states only how many columns or rows there will be in the frameset. <html> <frameset cols="25%,*,25%"> <frame src="frame_a.htm" /> <frame src="frame_b.htm" /> <frame src="frame_c.htm" /> </frameset> </html> |
|
|
<head>
|
The head element is a container for all the head elements. Elements inside <head> can include scripts, instruct the browser where to find style sheets, provide meta information, and more.
The following tags can be added to the head section: <base>, <link>, <meta>, <script>, <style>, and <title>. The <title> tag defines the title of the document, and is the only required element in the head section! <html> <head> <title>Title of the document</title> </head> <body> The content of the document...... </body> </html> |
|
|
<h1> -<h6>
|
The <h1> to <h6> tags are used to define HTML headings.
<h1> defines the largest heading and <h6> defines the smallest heading. <h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6> |
|
|
<html>
|
The <html> tag tells the browser that this is an HTML document.
The html element is the outermost element in HTML and XHTML documents. The html element is also known as the root element. <html> <head> <title>Title of the document</title> </head> <body> The content of the document...... </body> </html> |
|
|
<iframe>
|
The <iframe> tag defines an inline frame that contains another document.
ttribute Value Description DTD align left right top middle bottom Deprecated. Use styles instead. Specifies the alignment of an iframe according to surrounding elements TF frameborder 1 0 Specifies whether or not to display a border around an iframe TF height pixels % Specifies the height of an iframe TF longdesc URL Specifies a page that contains a long description of the content of an iframe TF marginheight pixels Specifies the top and bottom margins of an iframe TF marginwidth pixels Specifies the left and right margins of an iframe TF name name Specifies the name of an iframe TF scrolling yes no auto Specifies whether or not to display scrollbars in an iframe TF src URL Specifies the URL of the document to show in an iframe TF width pixels % Specifies the width of an iframe TF |
|
|
<img>
|
The <img> tag embeds an image in an HTML page.
Notice that images are not technically inserted into an HTML page, images are linked to HTML pages. The <img> tag creates a holding space for the referenced image. The <img> tag has two required attributes: src and alt. <img src="angry.gif" alt="Angry face" /> |
|
|
<input>
|
The <input> tag is used to select user information.
An input field can vary in many ways, depending on the type attribute. An input field can be a text field, a checkbox, a password field, a radio button, a button, and more. <form action="form_action.asp" method="get"> First name: <input type="text" name="fname" /><br /> Last name: <input type="text" name="lname" /><br /> <input type="submit" value="Submit" /> </form> |
|
|
<link>
|
The <link> tag defines the relationship between a document and an external resource.
The <link> tag is most used to link to style sheets. <head> <link rel="stylesheet" type="text/css" href="theme.css" /> </head> |
|
|
<map>
|
The <map> tag is used to define a client-side image-map. An image-map is an image with clickable areas.
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap" /> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" /> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury" /> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus" /> </map> The name attribute is required in the map element. This attribute is associated with the <img>'s usemap attribute and creates a relationship between the image and the map. The map element contains a number of area elements, that defines the clickable areas in the image map. |
|
|
<menu>
|
The <menu> tag is used to create a list of menu choices.
<menu> <li>html</li> <li>xhtml</li> <li>css</li> </menu> |
|
|
<object>
|
The <object> tag is used to include objects such as images, audio, videos, Java applets, ActiveX, PDF, and Flash.
The object element was intended to replace the img and applet elements. However, because of bugs and a lack of browser support this has not happened. The object support in browsers depend on the object type. Unfortunately, the major browsers use different codes to load the same object type. Luckily, the object element provides a solution. If the object element is not displayed, the code between the <object> and </object> tags will be executed. This way we can have several nested object elements (one for each browser). <object classid="clsid:F08DF954-8592-11D1-B16A-00C0F0283628" id="Slider1" width="100" height="50"> <param name="BorderStyle" value="1" /> <param name="MousePointer" value="0" /> <param name="Enabled" value="1" /> <param name="Min" value="0" /> <param name="Max" value="10" /> </object> |
|
|
<ol>
|
The <ol> tag is used to create an ordered list.
The list can be numerical or alphabetical. <ol> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> |
|
|
<optgroup>
|
The <optgroup> tag is used to group together related options in a select list.
<select> <optgroup label="Swedish Cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> </optgroup> <optgroup label="German Cars"> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </optgroup> </select> If you have a long list of options, groups of related options are easier to handle for the user. |
|
|
<option>
|
The <option> tag defines an option in a select list.
The option element goes inside the select element. <select> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> </select> |
|
|
<p>
|
The <p> tag defines a paragraph.
The p element automatically creates some space before and after itself. The space is automatically applied by the browser, or you can specify it in a style sheet. <p>This is some text in a paragraph.</p> |
|
|
<param>
|
The <param> tag is used to define parameters or variables for an object or applet element.
<object classid="clsid:F08DF954-8592-11D1-B16A-00C0F0283628" id="Slider1" width="100" height="50"> <param name="BorderStyle" value="1" /> <param name="MousePointer" value="0" /> <param name="Enabled" value="1" /> <param name="Min" value="0" /> <param name="Max" value="10" /> </object> |
|
|
<pre>
|
The <pre> tag defines preformatted text.
Text in a pre element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks. <pre> Text in a pre element is displayed in a fixed-width font, and it preserves both spaces and line breaks </pre> |
|
|
<q>
|
The <q> tag defines a short quotation.
The browser will insert quotation marks around the quotation. <q> Here is a short quotation here is a short quotation </q> |
|
|
<s>
|
The <s> and <strike> tags defines strikethrough text.
<p>Version 2.0 is <s>not yet available!</s> now available!</p> <p>Version 2.0 is <strike>not yet available!</strike> now available!</p> |
|
|
<style>
|
The <style> tag is used to define style information for an HTML document.
<html> <head> <style type="text/css"> h1 {color:red} p {color:blue} </style> </head> <body> <h1>Header 1</h1> <p>A paragraph.</p> </body> </html> In the style element you specify how HTML elements should render in a browser. The required type attribute defines the content of the style element. The only possible value is "text/css". The style element always goes inside the head section. |
|
|
<sub>
|
The <sub> tag defines subscript text. Subscript text appears half a character below the baseline. Subscript text can be used for chemical formulas, like H2O.
The <sup> tag defines superscript text. Superscript text appears half a character above the baseline. Superscript text can be used for footnotes, like WWW[1]. <p>This text contains <sub>subscript</sub> text.</p> <p>This text contains <sup>superscript</sup> text.</p> |
|
|
<table>
|
The <table> tag defines an HTML table.
A simple HTML table consists of the table element and one or more tr, th, and td elements. The tr element defines a table row, the th element defines a table header, and the td element defines a table cell. A more complex HTML table may also include caption, col, colgroup, thead, tfoot, and tbody elements. <table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table> |
|
|
<tbody>
|
The <tbody> tag is used to group the body content in an HTML table.
<table border="1"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table> The tbody element should be used in conjunction with the thead and tfoot elements. The thead element is used to group the header content in an HTML table and the tfoot element is used to group the footer content in an HTML table. Note: <tfoot> must appear before <tbody> within a table, so that a browser can render the foot before receiving all the rows of data. Notice that these elements will not affect the layout of the table by default. However, you can use CSS to let these elements affect the table's layout. |
|
|
<td>
|
The <td> tag defines a standard cell in an HTML table.
An HTML table has two kinds of cells: Header cells - contains header information (created with the th element) Standard cells - contains data (created with the td element) The text in a th element is bold and centered. The text in a td element is regular and left-aligned. <table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table> |
|
|
<textarea>
|
The <textarea> tag defines a multi-line text input control.
A text area can hold an unlimited number of characters, and the text renders in a fixed-width font (usually Courier). The size of a textarea can be specified by the cols and rows attributes, or even better; through CSS' height and width properties. <textarea rows="2" cols="20"> At W3Schools you will find all the Web-building tutorials you need, from basic HTML to advanced XML, SQL, ASP, and PHP. </textarea> |
|
|
The <tfoot> tag is used to group the footer content in an HTML table.
The tfoot element should be used in conjunction with the thead and tbody elements. The thead element is used to group the header content in an HTML table and the tbody element is used to group the body content in an HTML table. Note: <tfoot> must appear before <tbody> within a table, so that a browser can render the foot before receiving all the rows of data. Notice that these elements will not affect the layout of the table by default. However, you can use CSS to let these elements affect the table's layout. |
TheThe <tfoot> tag is used to group the footer content in an HTML table.
The tfoot element should be used in conjunction with the thead and tbody elements. The thead element is used to group the header content in an HTML table and the tbody element is used to group the body content in an HTML table. Note: <tfoot> must appear before <tbody> within a table, so that a browser can render the foot before receiving all the rows of data. Notice that these elements will not affect the layout of the table by default. However, you can use CSS to let these elements affect the table's layout. tag is used to group the footer content in an HTML table. The tfoot element should be used in conjunction with the thead and tbody elements. The thead element is used to group the header content in an HTML table and the tbody element is used to group the body content in an HTML table. Note: <tfoot> must appear before <tbody> within a table, so that a browser can render the foot before receiving all the rows of data. Notice that these elements will not affect the layout of the table by default. However, you can use CSS to let these elements affect the table's layout. <table border="1"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table> |
|
|
<th>
|
The <th> tag defines a header cell in an HTML table.
An HTML table has two kinds of cells: Header cells - contains header information (created with the th element) Standard cells - contains data (created with the td element) The text in a th element is bold and centered. The text in a td element is regular and left-aligned. <table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table> |
|
|
<thead>
|
The <thead> tag is used to group the header content in an HTML table.
<table border="1"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table> The thead element should be used in conjunction with the tbody and tfoot elements. The tbody element is used to group the body content in an HTML table and the tfoot element is used to group the footer content in an HTML table. Note: <tfoot> must appear before <tbody> within a table, so that a browser can render the foot before receiving all the rows of data. Notice that these elements will not affect the layout of the table by default. However, you can use CSS to let these elements affect the table's layout. |
|
|
<title>
|
The <title> tag defines the title of the document.
The title element is required in all HTML/XHTML documents. The title element: defines a title in the browser toolbar provides a title for the page when it is added to favorites displays a title for the page in search-engine results <html> <head> <title>Title of the document</title> </head> <body> The content of the document...... </body> </html> |
|
|
<tr>
|
The <tr> tag defines a row in an HTML table.
A tr element contains one or more th or td elements. <table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table> |
|
|
<u>
|
The <u> tag defines underlined text.
<p>Do not <u>underline</u> text if it is not a hyperlink!</p> |
|
|
<ul>
|
The <ul> tag defines an unordered list (a bulleted list).
<ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul> |
