Tuesday, March 3, 2009
introduction to HTML
This collection of pages explains how to use the different HTML document description elements, or tags and how to use these elements to write good, well designed HTML documents. This particular page describes the overall content and organization of the material presented here, reviews some related resources that may be of interest, and describes the meanings of the navigational "buttons" you use to navigate from page to page.
What is HTML
HTML are initials that stand for Hyper Text Markup Language
* Hyper is the opposite of linear. It used to be that computer programs had to move in a linear fashion. This before this, this before this, and so on. HTML does not hold to that pattern and allows the person viewing the World Wide Web page to go anywhere, any time they want.
* Text is what you will use. English letters, just like you use everyday..
* Markup is what you will do. You will write in plain English and then mark up what you wrote.
* Language. Some may argue that technically html is a code, but you write html in plain, everyday English language.
HTML is the code behind your webpage and is what your browser looks for to display a webpage, the way the webdesigner intended it to look, and is a series of tags that tells the browser where to display what. It is really a series of simple commands that you give to the browser, just like telling your dog to sit, and because it is in plain English it is easy to learn. For example, if you want your text to show in a bold type, you command it to be bold text , it really is that easy.
Keep this in mind: HTML documents must be text only.
When you save a HTML document, you must save only the text, nothing else. HTML browsers can only read text. Look at your keyboard. See the letters and numbers and little signs like % and @ and *? There are 128 in all (read upper- and lowercase letters as two). That's text. That's what the browser reads. It simply doesn't understand anything else.
Remember that if you are using Notepad, Wordpad, or Simple Text, the document will be saved as text with no extra prompting. Just choose SAVE.
If you are going to start learning to write HTML, it is a good idea to learn to look at other authors' HTML pages. The actual html potion of the page behind the pretty page you see in front of you now.
Looking at another's html code helps you learn how things are done and you can copy the style of pages that you like. Please do not just steal and copy the pages, but no one will be upset if you make the style in much the same way. For example, if you were going to build a house, you would look around to see what styles you like before deciding on your own design. Same thing here, look around the web and see what styles you like and apply them to your own ideas.
Here's how you look at an HTML document (known as the "source code")
* When you find a page you like, click on VIEW at the top of the screen.
* Choose SOURCE from the menu.
* The HTML document will appear on the screen.
Try it with this page. Click on VIEW and then choose the SOURCE.
It will look like mumbo jumbo right now, but soon it'll be readable and you'll be able to find exactly how a certain HTML presentation was performed.
What are HTML Tags?
HTML works in a very simple, very logical, format. It reads like you do, top to bottom, left to right. HTML is written with TEXT. What you use to set certain sections apart as bigger text, smaller text, bold text, underlined text, is a series of tags.
Think of tags as commands. For example if you want a line of text to be bold. You will put a tag at the exact point you want the bold lettering to startand another tag where you want the bold lettering to stop. There you have an example of how tags make commands and tell the browser how to display the text. Just like telling a dog to sit. You give the command.
All tags that are opened must correspondingly be closed, just as if you are writing a quoted statement with those "inverted commas". A tag is closed this way therefore we open a new tag and close the tag
* Hyper is the opposite of linear. It used to be that computer programs had to move in a linear fashion. This before this, this before this, and so on. HTML does not hold to that pattern and allows the person viewing the World Wide Web page to go anywhere, any time they want.
* Text is what you will use. English letters, just like you use everyday..
* Markup is what you will do. You will write in plain English and then mark up what you wrote.
* Language. Some may argue that technically html is a code, but you write html in plain, everyday English language.
HTML is the code behind your webpage and is what your browser looks for to display a webpage, the way the webdesigner intended it to look, and is a series of tags
Keep this in mind: HTML documents must be text only.
When you save a HTML document, you must save only the text, nothing else. HTML browsers can only read text. Look at your keyboard. See the letters and numbers and little signs like % and @ and *? There are 128 in all (read upper- and lowercase letters as two). That's text. That's what the browser reads. It simply doesn't understand anything else.
Remember that if you are using Notepad, Wordpad, or Simple Text, the document will be saved as text with no extra prompting. Just choose SAVE.
If you are going to start learning to write HTML, it is a good idea to learn to look at other authors' HTML pages. The actual html potion of the page behind the pretty page you see in front of you now.
Looking at another's html code helps you learn how things are done and you can copy the style of pages that you like. Please do not just steal and copy the pages, but no one will be upset if you make the style in much the same way. For example, if you were going to build a house, you would look around to see what styles you like before deciding on your own design. Same thing here, look around the web and see what styles you like and apply them to your own ideas.
Here's how you look at an HTML document (known as the "source code")
* When you find a page you like, click on VIEW at the top of the screen.
* Choose SOURCE from the menu.
* The HTML document will appear on the screen.
Try it with this page. Click on VIEW and then choose the SOURCE.
It will look like mumbo jumbo right now, but soon it'll be readable and you'll be able to find exactly how a certain HTML presentation was performed.
What are HTML Tags?
HTML works in a very simple, very logical, format. It reads like you do, top to bottom, left to right. HTML is written with TEXT. What you use to set certain sections apart as bigger text, smaller text, bold text, underlined text, is a series of tags.
Think of tags as commands. For example if you want a line of text to be bold. You will put a tag at the exact point you want the bold lettering to start
All tags that are opened must correspondingly be closed, just as if you are writing a quoted statement with those "inverted commas". A tag is closed this way therefore we open a new tag
Basic HTML Tags
What Is a Tag?
* A tag is a method of formatting HTML documents.
* With tags you can create italic or bold characters, make things blink, and can control the color and size of the lettering.
* Tags can be "nested". This means that you can make something bold and italic and green and blinking by simply surrounding the previous tag with the next.
* Tags can be used to insert pictures and graphics.
* Tags can be used to create bulleted lists like this one, or numbered lists.
* Tags look something like this: chosen text .
* All tags use the < and > (less-than and greater-than symbols) to signal the browser. These are located above the comma and period keys.
* Within a tag, capitalization doesn't matter. FONT is the same as font or Font . I usually don't bother capitalizing when I use tags. Below, I have used capital letters when I felt that the number "1" and the letter "l" might be confused.
* It is essential to always close the tags! If not, the formatting will contaminate everything that follows it. But don't panic, closing tags is very easy, and even the most experienced surfers sometimes forget.
Italics
To make italics surround the chosen text with these tags:
chosen text
The "/i" tag is essential; this will close the tag and stop the italics. If this is not done, all the text which follows the first, i , tag will appear italicized.
Bold Lettering
To make letters bold surround the chosen text with these tags:
chosen text
The "/b" tag is essential; this will close the tag and stop the bold lettering. If this is not done, all the text which follows the first, b , tag will appear in bold.
Changing Font Size
There are three different ways to change the size of the font. Method 1, Method 2, and Method 3.
Also see below on how to change both the size and the color of the font at the same time.
1. The first method is to use the "big" and "small" tags.
For example, to increase the font by one degree surround the text with the following tags:
chosen text
If you want to make it even bigger, you surround it again:
chosen text
To make the font small, surround it with the small tag:
chosen text
If you want to make it even smaller, surround it with the tag again:
chosen text
The "/big" and "/small" tags are essential; they will close the tag and stop the special formatting. If this is not done, all the text which follows the first, or , tag will appear in the altered size.
2. The second method is to directly change the font size.
You can use + and - along with a number to shrink and grow the font:
chosen text
chosen text .........(same as )
chosen text .........(plain text)
chosen text .........(same as )
chosen text
Notice that when you get to larger fonts they tend to appear bold.
The " /font " tag is essential; it will close the tag and define the end of the specialized formatting. If this is not done, all the text which follows the first, font size= , tag will appear in the altered size.
3. The third method is to use what are called headers.
Headers are abbreviated with the letter "h" and a number from 1 to 6. For example:
Along with the tag, I will demonstrate the result for each:
Notice that the header method also utilizes a bold font.
The "/h# " tag is essential; it will close the tag and define the end of the specialized formatting. If this is not done, all the text which follows the first, , tag will appear in the altered size.
Blinking Text
To make text blink surround the chosen text with these tags:
Note: This will not show up if you are using Microsoft Explorer (Blame it on Bill Gates!).
The "/blink" tag is essential; this will close the tag and signal the end of the special formatting. If this is not done, all the text which follows the first,
* A tag is a method of formatting HTML documents.
* With tags you can create italic or bold characters, make things blink, and can control the color and size of the lettering.
* Tags can be "nested". This means that you can make something bold and italic and green and blinking by simply surrounding the previous tag with the next.
* Tags can be used to insert pictures and graphics.
* Tags can be used to create bulleted lists like this one, or numbered lists.
* Tags look something like this: chosen text .
* All tags use the < and > (less-than and greater-than symbols) to signal the browser. These are located above the comma and period keys.
* Within a tag, capitalization doesn't matter. FONT is the same as font or Font . I usually don't bother capitalizing when I use tags. Below, I have used capital letters when I felt that the number "1" and the letter "l" might be confused.
* It is essential to always close the tags! If not, the formatting will contaminate everything that follows it. But don't panic, closing tags is very easy, and even the most experienced surfers sometimes forget.
Italics
To make italics surround the chosen text with these tags:
chosen text
The "/i" tag is essential; this will close the tag and stop the italics. If this is not done, all the text which follows the first, i , tag will appear italicized.
Bold Lettering
To make letters bold surround the chosen text with these tags:
chosen text
The "/b" tag is essential; this will close the tag and stop the bold lettering. If this is not done, all the text which follows the first, b , tag will appear in bold.
Changing Font Size
There are three different ways to change the size of the font. Method 1, Method 2, and Method 3.
Also see below on how to change both the size and the color of the font at the same time.
1. The first method is to use the "big" and "small" tags.
For example, to increase the font by one degree surround the text with the following tags:
chosen text
If you want to make it even bigger, you surround it again:
chosen text
To make the font small, surround it with the small tag:
chosen text
If you want to make it even smaller, surround it with the tag again:
chosen text
The "/big" and "/small" tags are essential; they will close the tag and stop the special formatting. If this is not done, all the text which follows the first, or , tag will appear in the altered size.
2. The second method is to directly change the font size.
You can use + and - along with a number to shrink and grow the font:
chosen text
chosen text .........(same as )
chosen text .........(plain text)
chosen text .........(same as )
chosen text
Notice that when you get to larger fonts they tend to appear bold.
The " /font " tag is essential; it will close the tag and define the end of the specialized formatting. If this is not done, all the text which follows the first, font size= , tag will appear in the altered size.
3. The third method is to use what are called headers.
Headers are abbreviated with the letter "h" and a number from 1 to 6. For example:
chosen text
Along with the tag, I will demonstrate the result for each:
chosen text
chosen text
chosen text
chosen text
chosen text
chosen text
Notice that the header method also utilizes a bold font.
The "/h# " tag is essential; it will close the tag and define the end of the specialized formatting. If this is not done, all the text which follows the first,
Blinking Text
To make text blink surround the chosen text with these tags:
Note: This will not show up if you are using Microsoft Explorer (Blame it on Bill Gates!).
The "/blink" tag is essential; this will close the tag and signal the end of the special formatting. If this is not done, all the text which follows the first,
Text Formating tags
Getting text into your web page is quite easy - just start typing between the two BODY tags. When you save your work and view it in a browser, the text will appear without any special formatting. You don't need to specify a type of font to use, or a colour, or a size. This is because browsers are set up to use defaults when no instructions are given.
Text formatting, in html terms, is when you give the browser instructions on how your text should look. These instructions come in the form of tags, and you'll learn these now.
Colour
You can specify which colour you want to use for all the text on your web page. The browser default is black, so you only really need to specify a colour if you don't want black. Here's how to do it.
*
Start your HTML Editor
*
Click File > New
*
Set a background colour and click OK
*
When you see the code, locate the first BODY tag
*
Click your cursor after the "Y" of BODY
*
Press the spacebar on your keyboard
*
Type in TEXT =
*
Then type a colour for your text
*
In between the two BODY tags, start typing you text
*
Save your web page, and then view the results
*
In the code below, the text has been set to Blue
If all you want to do is to change the colour of some text between the BODY tags, your HTML editor has a quick way of doing that.
*
Highlight the text whose colour you want to change
*
From the menu bar, click on Format > Text Colour
*
The Colour dialogue box appears
*
Choose a colour by clicking on a colour square
*
Click OK
Headings
You've already met the Headings tag. If you'll remember, the Heading tag uses the letter "H" followed by a number. Like this:
or like this:
The heading tag increases or decreases text size above or below the default size. The default size is 3. The biggest size is 1, and the smallest 7.
The heading tag will automatically insert a line break for you, so you don't have to insert a
The forward slash, remember, tells the browser to stop formatting a tag. In this case, stop formatting the H1 heading tag.
With the cursor flashing between the two tags, type your text for the heading.
Centring Text
To centre text (and anything else on your page), the CENTER tag is used. Note the American spelling, with "ER" at the end and not "RE". To centre something with the HTML Editor, do the following:
*
Highlight whatever you want to centre
*
From the menu bar, click on Format > Centre
*
The two CENTER tags will surround your highlighted text
*
Save your work and view the results in your browser
In this lesson, we'll continue our look at the basic text formatting tags available to you in HTML
Bold Text
You can make text stand out by using the bold tag.
*
In your Editor, highlight the text you want to make bold
*
From the menu bar, click on Format > Bold
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Bold Text
Italics
The HTML tag to make text italic is as simple as the "B" tag for bold text. With your HTML editor, do the following:
*
Highlight the text for the italics
*
From the menu bar, click on Format > Italics
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Subscript
Subscript is text that appears below normal text. Like this:
50p
You can have Subscript in your HTML code quite easily. To format text as subscript using your HTML editor, do this:
*
Highlight the text you want to turn into subscript
*
From the menu bar, click on Format > Subscript
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Superscript
Superscript is text that is raised slightly above the centre. Like this
24th
To format text as superscript using your HTML editor, do this:
*
Highlight the text you want to turn into superscript
*
From the menu bar, click on Format > Superscript
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Text formatting, in html terms, is when you give the browser instructions on how your text should look. These instructions come in the form of tags, and you'll learn these now.
Colour
You can specify which colour you want to use for all the text on your web page. The browser default is black, so you only really need to specify a colour if you don't want black. Here's how to do it.
*
Start your HTML Editor
*
Click File > New
*
Set a background colour and click OK
*
When you see the code, locate the first BODY tag
*
Click your cursor after the "Y" of BODY
*
Press the spacebar on your keyboard
*
Type in TEXT =
*
Then type a colour for your text
*
In between the two BODY tags, start typing you text
*
Save your web page, and then view the results
*
In the code below, the text has been set to Blue
If all you want to do is to change the colour of some text between the BODY tags, your HTML editor has a quick way of doing that.
*
Highlight the text whose colour you want to change
*
From the menu bar, click on Format > Text Colour
*
The Colour dialogue box appears
*
Choose a colour by clicking on a colour square
*
Click OK
Headings
You've already met the Headings tag. If you'll remember, the Heading tag uses the letter "H" followed by a number. Like this:
My Heading
or like this:
My Heading
The heading tag increases or decreases text size above or below the default size. The default size is 3. The biggest size is 1, and the smallest 7.
The heading tag will automatically insert a line break for you, so you don't have to insert a
or
tag after it to start a new line.
To insert a Heading tag with the HTML Editor, click on Insert > Heading then choose a Heading size. Only size 1 to 4 are used in the editor. But bear in mind, you can go as low as size 7.
When you click on a heading size, the beginning and end Tag will be inserted with the cursor flashing between the two:
The forward slash, remember, tells the browser to stop formatting a tag. In this case, stop formatting the H1 heading tag.
With the cursor flashing between the two tags, type your text for the heading.
Centring Text
To centre text (and anything else on your page), the CENTER tag is used. Note the American spelling, with "ER" at the end and not "RE". To centre something with the HTML Editor, do the following:
*
Highlight whatever you want to centre
*
From the menu bar, click on Format > Centre
*
The two CENTER tags will surround your highlighted text
*
Save your work and view the results in your browser
In this lesson, we'll continue our look at the basic text formatting tags available to you in HTML
Bold Text
You can make text stand out by using the bold tag.
*
In your Editor, highlight the text you want to make bold
*
From the menu bar, click on Format > Bold
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Bold Text
Italics
The HTML tag to make text italic is as simple as the "B" tag for bold text. With your HTML editor, do the following:
*
Highlight the text for the italics
*
From the menu bar, click on Format > Italics
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Subscript
Subscript is text that appears below normal text. Like this:
50p
You can have Subscript in your HTML code quite easily. To format text as subscript using your HTML editor, do this:
*
Highlight the text you want to turn into subscript
*
From the menu bar, click on Format > Subscript
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
Superscript
Superscript is text that is raised slightly above the centre. Like this
24th
To format text as superscript using your HTML editor, do this:
*
Highlight the text you want to turn into superscript
*
From the menu bar, click on Format > Superscript
*
The two tags will surround your highlighted text
*
Save your work and view the results in your browser
PRE tag
HTML Pre Tag
The HTML pre tags are used to define the HTML pre element. The HTML pre element begins with the HTML
HTML Pre Element Attributes
HTML "pre" element attributes include:
* width - (Depreciated). The "width" attribute specifies the number of characters across the screen to display. This is very rarely used. An example of its use is blockquote width="20"
* class - The class attribute is used in conjunction with style sheets to associate an element with a class. The class attribute can set a class for specific element types or it can be independent of element types and work for all elements. The class attribute will provide the settings for specific style formatting. CSS properties are shown at the CSS Properties page.
* ID - The ID attribute is used to apply style settings to specific individual HTML elements.
* style - The style attribute is used to apply style settings for the specific element the style attribute is included with. An example is"
This is how it looks:
switch ( )
{
case condition1
break;
case condition2
break;
}
The HTML pre tags are used to define the HTML pre element. The HTML pre element begins with the HTML
tag and ends with the HTMLtag. The HTML pre element is used to direct the browser to display a section of text exactly as it is typed with spaces and line feeds included.
HTML Pre Element Attributes
HTML "pre" element attributes include:
* width - (Depreciated). The "width" attribute specifies the number of characters across the screen to display. This is very rarely used. An example of its use is blockquote width="20"
* class - The class attribute is used in conjunction with style sheets to associate an element with a class. The class attribute can set a class for specific element types or it can be independent of element types and work for all elements. The class attribute will provide the settings for specific style formatting. CSS properties are shown at the CSS Properties page.
* ID - The ID attribute is used to apply style settings to specific individual HTML elements.
* style - The style attribute is used to apply style settings for the specific element the style attribute is included with. An example is"
- This sets the style or color of the text. This statement starts a paragraph with color, green:
. The STYLE attribute is common to most HTML elements (See the CSS Properties page).
* title - Used to give specific elements a title which may appear as a tooltip in some browsers when the mouse is held at or near the element.
HTML Pre Element Contents
The HTML pre element may contain other inline elements except "img", "object", "applet", "big", "small", "sub", sup". "font", and "basefont". HTML inline elements are listed at the HTML Inline Elements.
HTML Pre Element Inside
The HTML pre element can be contained inside the elements "applet", "blockquote", "body", "button", "center", "del", "dd", "div", "fieldset", "form", "iframe", "ins", "li", "map", "noframes", "noscript", "object", "td", and "th".
HTML Pre Element Use Example
The PRE element is handy for showing program code or part of file content as in this example:
switch ( )
{
case condition1
break;
case condition2
break;
}
This is how it looks:
switch ( )
{
case condition1
break;
case condition2
break;
}
CODE tag
The code tag is designed to display computer code in a special font, usually in a mono spaced font style. However, the exact appearance will be browser dependent. You may still need to use various HTML tags, such as br and p, to create a presentation and appearance to suit your needs.
An HTML code example cannot use the HTML delimiters < and >, because they will be executed by the browser as real HTML code. Rather you must substitute a < for the < and a > for the >.
Usually, the display font appearance for the code, kbd, samp, and tt tags is the same for a specific browser.
The pre tag is more commonly used to display code.
The separate closing tag is mandatory.
Attributes and Events
class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
An HTML code example cannot use the HTML delimiters < and >, because they will be executed by the browser as real HTML code. Rather you must substitute a < for the < and a > for the >.
Usually, the display font appearance for the code, kbd, samp, and tt tags is the same for a specific browser.
The pre tag is more commonly used to display code.
The separate closing tag is mandatory.
Attributes and Events
class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
KBD tag
kbd is an HTML tag that is used to specify text to be typed in by the user (usually on a keyboard). While seldom used, this tag is useful for writing documentation for computer users. While the tag usually renders text by displaying it in a monospaced font, the tag should not be used simply for this purpose.
See also: code, font, plaintext, pre, samp, tt, var
Attributes
The kbd tag does not have any required HTML attributes. It does, however have numerous allowable attributes including:
* HTML Core Attributes
o class (type: CDATA) - space separated list of classes
o id (type: ID) - document-wide unique id
o style (type: Style Sheet) - associated style information
o title (type: Text) - advisory title/amplification; this information is usually displayed through tooltips
* HTML International Attributes (I18N)
o dir (type: Custom) - specifies the direction of weak or neutral text; valid values include ltr (left to right) or rtl (right to left)
o lang (type: Custom) - specifies the Language Code of the language used in the text
* HTML Event Attributes
o onclick (type: Script) - a pointer button was clicked
o ondblclick (type: Script) - a pointer button was double clicked
o onkeydown (type: Script) - a key was pressed down
o onkeypress (type: Script) - a key was pressed and released
o onkeyup (type: Script) - a key was released
o onmousedown (type: Script) - a pointer button was pressed down
o onmousemove (type: Script) - a pointer was moved within
o onmouseout (type: Script) - a pointer was moved away
o onmouseover (type: Script) - a pointer was moved onto
o onmouseup (type: Script) - a pointer button was released
Usage
To use the kbd tag, simply place opening and closing HTML tags around the characters that should be entered by the user. For example:
To destroy the usefulness of your computer, type del C:\*.* /S /Q at the command prompt.
On browsers that support this tag, this will typically cause the phrase "del *.* /S /Q" to be displayed in a monospaced font. Keep in mind that the purpose of this tag is to specify text to be typed in by the user, not to format your text. If you simply want to use a teletype font, you should technically use Cascading Style Sheets or the pre tag, however there are also the deprecated plaintext, samp, and tt tags that will do this as well.
See also: code, font, plaintext, pre, samp, tt, var
Attributes
The kbd tag does not have any required HTML attributes. It does, however have numerous allowable attributes including:
* HTML Core Attributes
o class (type: CDATA) - space separated list of classes
o id (type: ID) - document-wide unique id
o style (type: Style Sheet) - associated style information
o title (type: Text) - advisory title/amplification; this information is usually displayed through tooltips
* HTML International Attributes (I18N)
o dir (type: Custom) - specifies the direction of weak or neutral text; valid values include ltr (left to right) or rtl (right to left)
o lang (type: Custom) - specifies the Language Code of the language used in the text
* HTML Event Attributes
o onclick (type: Script) - a pointer button was clicked
o ondblclick (type: Script) - a pointer button was double clicked
o onkeydown (type: Script) - a key was pressed down
o onkeypress (type: Script) - a key was pressed and released
o onkeyup (type: Script) - a key was released
o onmousedown (type: Script) - a pointer button was pressed down
o onmousemove (type: Script) - a pointer was moved within
o onmouseout (type: Script) - a pointer was moved away
o onmouseover (type: Script) - a pointer was moved onto
o onmouseup (type: Script) - a pointer button was released
Usage
To use the kbd tag, simply place opening and closing HTML tags around the characters that should be entered by the user. For example:
To destroy the usefulness of your computer, type del C:\*.* /S /Q at the command prompt.
On browsers that support this tag, this will typically cause the phrase "del *.* /S /Q" to be displayed in a monospaced font. Keep in mind that the purpose of this tag is to specify text to be typed in by the user, not to format your text. If you simply want to use a teletype font, you should technically use Cascading Style Sheets or the pre tag, however there are also the deprecated plaintext, samp, and tt tags that will do this as well.
SAMP tag
The samp tag is designed to place emphasis on a short string of special characters. The designated text is displayed in a teletype or mono space font face. The actual appearance will be determined by the browser.
For many browsers, the display font appearance for the code, kbd, samp, and tt tags is the same.
The separate closing tag is mandatory.
Attributes and Events
class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
For many browsers, the display font appearance for the code, kbd, samp, and tt tags is the same.
The separate closing tag is mandatory.
Attributes and Events
class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
TT tag
The tag causes the designated text to be displayed in a teletype or mono space font face. The actual appearance will be determined by the browser.
Usually, the display font appearance for the code, kbd, samp, and tt tags is the same. The listing tag has been deprecated.
The closing tag is mandatory.
Core attributes:
class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
Usually, the display font appearance for the code, kbd, samp, and tt tags is the same. The listing tag has been deprecated.
The closing tag is mandatory.
Core attributes:
class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
PLAINTEXT tag
This is an obsolete tag that has been replaced by the PRE tag. It's behavior can be very odd on some browsers, including recent browser versions (some browsers do not recognize the closing tag, thus everything after the opening is rendered as plain text, including the closing BODY and HTML tags.<br /><br />Example code:<br /><br />An example of how the <PLAINTEXT><I>Plaintext tag</I></PLAINTEXT> works in a document. Note that HTML tags are ignored within the PLAINTEXT tags.
<div style='clear: both;'></div>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
Posted by
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta content='https://www.blogger.com/profile/05809430139875726857' itemprop='url'/>
<a class='g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' title='author profile'>
<span itemprop='name'>html and php</span>
</a>
</span>
</span>
<span class='post-timestamp'>
at
<meta content='http://htmlandphp.blogspot.com/2009/03/plaintext-tag.html' itemprop='url'/>
<a class='timestamp-link' href='https://htmlandphp.blogspot.com/2009/03/plaintext-tag.html' rel='bookmark' title='permanent link'><abbr class='published' itemprop='datePublished' title='2009-03-03T02:17:00-08:00'>2:17 AM</abbr></a>
</span>
<span class='post-comment-link'>
<a class='comment-link' href='https://htmlandphp.blogspot.com/2009/03/plaintext-tag.html#comment-form' onclick=''>
No comments:
</a>
</span>
<span class='post-icons'>
<span class='item-control blog-admin pid-1323227177'>
<a href='https://www.blogger.com/post-edit.g?blogID=6830606489310006988&postID=3089726707773499780&from=pencil' title='Edit Post'>
<img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</span>
<div class='post-share-buttons goog-inline-block'>
</div>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
Labels:
<a href='https://htmlandphp.blogspot.com/search/label/PLAINTEXT%20tag' rel='tag'>PLAINTEXT tag</a>
</span>
</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
</span>
</div>
</div>
</div>
</div>
<div class='post-outer'>
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<meta content='6830606489310006988' itemprop='blogId'/>
<meta content='8137431514947377502' itemprop='postId'/>
<a name='8137431514947377502'></a>
<h3 class='post-title entry-title' itemprop='name'>
<a href='https://htmlandphp.blogspot.com/2009/03/xmp-tag.html'>XMP tag</a>
</h3>
<div class='post-header'>
<div class='post-header-line-1'></div>
</div>
<div class='post-body entry-content' id='post-body-8137431514947377502' itemprop='description articleBody'>
XMP stands for "Extensible Metadata Platform", an XML/RDF-based metadata format which is being pushed by Adobe. Information in this format can be embedded in many different image file types including JPG, JP2, TIFF, GIF, EPS, PDF, PSD, DNG, PNG, DJVU, SVG and MIFF, as well as MOV, AVI, ASF, WMV, FLV, SWF and MP4 videos, and WMA and audio formats supporting ID3v2 information.<br /><br />The XMP Tag ID's aren't listed because in most cases they are identical to the Tag Name.<br /><br />All XMP information is stored as character strings. The Writable column specifies the information format: string is an unformatted string, integer is a string of digits (possibly beginning with a '+' or '-'), real is a floating point number, rational is entered as a floating point number but stored as two integer strings separated by a '/' character, date is a date/time string entered in the format "YYYY:MM:DD HH:MM:SS[.SS][+/-HH:MM]", boolean is either "True" or "False", and lang-alt is a list of string alternatives in different languages.<br /><br />Individual languages for lang-alt tags are accessed by suffixing the tag name with a '-', followed by an RFC 3066 language code (ie. "XMP:Title-fr", or "Rights-en-US"). A lang-alt tag with no language code accesses the "x-default" language, but causes other languages for this tag to be deleted when writing. The "x-default" language code may be specified when writing to preserve other existing languages (ie. "XMP-dc:Description-x-default"), but note that other languages are still deleted if the "x-default" language is deleted. When reading, "x-default" is not specified.<br /><br />The XMP tags are organized according to schema Namespace in the following tables. Note that a few of the longer namespace prefixes given below have been shortened for convenience (since the family 1 group names are derived from these by adding a leading "XMP-"). In cases where a tag name exists in more than one namespace, less common namespaces are avoided when writing. However, any namespace may be written by specifying a family 1 group name for the tag, ie) XMP-exif:Contrast or XMP-crs:Contrast.<br /><br />ExifTool will extract XMP information even if it is not listed in these tables. For example, the pdfx namespace doesn't have a predefined set of tag names because it is used to store application-defined PDF information, but this information is extracted by ExifTool.
<div style='clear: both;'></div>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
Posted by
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta content='https://www.blogger.com/profile/05809430139875726857' itemprop='url'/>
<a class='g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' title='author profile'>
<span itemprop='name'>html and php</span>
</a>
</span>
</span>
<span class='post-timestamp'>
at
<meta content='http://htmlandphp.blogspot.com/2009/03/xmp-tag.html' itemprop='url'/>
<a class='timestamp-link' href='https://htmlandphp.blogspot.com/2009/03/xmp-tag.html' rel='bookmark' title='permanent link'><abbr class='published' itemprop='datePublished' title='2009-03-03T02:04:00-08:00'>2:04 AM</abbr></a>
</span>
<span class='post-comment-link'>
<a class='comment-link' href='https://htmlandphp.blogspot.com/2009/03/xmp-tag.html#comment-form' onclick=''>
No comments:
</a>
</span>
<span class='post-icons'>
<span class='item-control blog-admin pid-1323227177'>
<a href='https://www.blogger.com/post-edit.g?blogID=6830606489310006988&postID=8137431514947377502&from=pencil' title='Edit Post'>
<img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</span>
<div class='post-share-buttons goog-inline-block'>
</div>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
Labels:
<a href='https://htmlandphp.blogspot.com/search/label/XMP%20tag' rel='tag'>XMP tag</a>
</span>
</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
</span>
</div>
</div>
</div>
</div>
<div class='post-outer'>
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<meta content='6830606489310006988' itemprop='blogId'/>
<meta content='3225449196447539119' itemprop='postId'/>
<a name='3225449196447539119'></a>
<h3 class='post-title entry-title' itemprop='name'>
<a href='https://htmlandphp.blogspot.com/2009/03/address-tag.html'>ADDRESS tag</a>
</h3>
<div class='post-header'>
<div class='post-header-line-1'></div>
</div>
<div class='post-body entry-content' id='post-body-3225449196447539119' itemprop='description articleBody'>
Note: If you don't know what a tag is and/or how you must use it we recommend you to read our HTML tags and attributes tutorial that you can find in our HTML tutorials section.<br /><br />Table of contents<br /><br /> * Description<br /> * Attributes<br /> * Events<br /> * Examples<br /><br /> <br /><br />Description<br />The HTML address tag is commonly used to provide contact information at the bottom or beginning of a document or a form. It could be used, for example, to provide information about the enterprise behind the website, the author of a specific article or the author of the website itself. Note that browsers may change the aspect of the text between these tags (e.g., italic font).<br /><br />Attributes<br />id (name)<br />The "id" attribute assigns an identifier to the associated element. This identifier must be unique in the document and can be used to refer to that element.<br /><br />Example:<br /><br />Code begin <p id="paragraph1">This is the first paragraph named as paragraph1. To dynamically change its properties use this identifier.</p>Code end<br /> <br /> <br /><br />class (cdata)<br />The "class" attribute assigns a class name (or a list of class names separated by spaces) to the container element. It's used with style sheets and tells the browser the class to which the element is associated with. A class gives visual attributes to elements.<br /><br />Example:<br /><br />Code begin <p class="references">This article is based on the book "Wind in the trees" by Jhon L. Brooks</p><br /><br /><p class="references important">This article is based on the book "Wind in the trees" by Jhon L. Brooks... and is more important than the one before.</p>Code end<br /> <br /> <br /><br />style (style)<br />Defines a visual style of this element. Is a better practice to define styles attributes in external style sheets grouping them in classes. Attributes in the "style" parameter must preserve this order "name : value" and be separated by a semi-colon.<br /><br />If you're writing XHTML code it's recommended not to use this attribute and try style sheet classes (with the "class" attribute).<br /><br />Example:<br /><br />Code begin <p style="color: #0000FF; font-size: 12pt">This is a paragraph with a defined style</p><br /><p>And this is another text without style.</p>Code end<br /> <br /> <br /><br />title (text)<br />Indicates a title for the element. Used to give a short description about the element that is usually shown as a "tool tip" when the user put the mouse pointer over the element.<br /><br />Example:<br /><br />Code View<br /><a title="HTMLQuick.com" href="http://www.htmlquick.com">HTML code</a> HTML code<br /> <br /><br />lang (langcode)<br />Specifies the language of an element's content. The default value in "unknown".<br /><br />When writing XHTML code the syntax "xml:lang" represents a preferred alternative in XHTML 1.0 and a replacement in XHTML 1.1 (e.g., xml:lang="en").<br /><br />Example:<br /><br />Code begin <p lang="en">This is a paragraph in english.</p><br /><p lang="es">Este es un párrafo en español.</p>Code end<br /> <br /> <br /><br />dir<br />Specifies the text direction of the element's contents and attribute values, as well as tables directionality. It has two possible values that are case insensitive:<br /><br /> * RTL: Right to left.<br /> * LTR: Left to right.<br /><br />Example:<br /><br />Code begin <q lang="he" dir="rtl">...a Hebrew quotation...</q>Code end<br /> <br /> <br /><br /><br />Events<br /><br /> * onclick<br /> * ondblclick<br /> * onmousedown<br /> * onmouseup<br /> * onmouseover<br /> * onmousemove<br /> * onmouseout<br /> * onkeypress<br /> * onkeydown<br /> * onkeyup<br /><br />See complete list and information about events in HTML<br /><br /><span style="font-weight:bold;">Events in HTML</span><br /><br />As well as attributes, events can be defined in HTML tags. Events, instead of giving values to the elements like the attributes, trigger actions when they occurs. These actions are defined by client-side scripts that are programs written to perform some action in a specific language (e.g., JavaScript, VBScript, etc.). There are different events that occurs in different instances according to browsers or users actions.<br /><br /><span style="font-weight:bold;">List of events</span><br /><br />Below is al list of all events available for the HTML 4.01 Standard.<br /><br /> * onload: The onload event occurs when the user agent finishes loading a window or all frames within a frameset.<br /> * onunload: The onunload event occurs when the user agent removes a document from a window or frame.<br /> * onclick: The onclick event is triggered when the mouse button is clicked over the element.<br /> * ondblclick: The ondblclick event occurs when the pointing device button is double clicked over an element.<br /> * onmousedown: The onmousedown event is triggered when the mouse button is pressed over the element.<br /> * onmouseup: The onmouseup event occurs when the pointing device button is released over an element.<br /> * onmouseover: The onmouseover event is triggered when the mouse is moved onto the element.<br /> * onmousemove: The onmousemove event occurs when the pointing device is moved while it is over an element.<br /> * onmouseout: The onmouseout event is triggered when the mouse is moved away from the element.<br /> * onfocus: The onfocus event occurs when an element receives focus either by the pointing device or by tabbing navigation.<br /> * onblur: The onblur event is triggered when an element loses focus either by the pointing device or by tabbing navigation.<br /> * onkeypress: The onkeypress event occurs when a key is pressed and released over an element.<br /> * onkeydown: The onkeydown event is triggered when a key is pressed down over the element.<br /> * onkeyup: The onkeyup event occurs when a key is released over an element.<br /> * onsubmit: The onsubmit event is triggered when a form is submitted.<br /> * onreset: The onreset event occurs when a form is reset.<br /> * onselect: The onselect event is triggered when a user selects some text in a text field.<br /> * onchange: The onchange event occurs when a control loses the input focus and its value has been modified since gaining focus.
<div style='clear: both;'></div>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
Posted by
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta content='https://www.blogger.com/profile/05809430139875726857' itemprop='url'/>
<a class='g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' title='author profile'>
<span itemprop='name'>html and php</span>
</a>
</span>
</span>
<span class='post-timestamp'>
at
<meta content='http://htmlandphp.blogspot.com/2009/03/address-tag.html' itemprop='url'/>
<a class='timestamp-link' href='https://htmlandphp.blogspot.com/2009/03/address-tag.html' rel='bookmark' title='permanent link'><abbr class='published' itemprop='datePublished' title='2009-03-03T01:59:00-08:00'>1:59 AM</abbr></a>
</span>
<span class='post-comment-link'>
<a class='comment-link' href='https://htmlandphp.blogspot.com/2009/03/address-tag.html#comment-form' onclick=''>
No comments:
</a>
</span>
<span class='post-icons'>
<span class='item-control blog-admin pid-1323227177'>
<a href='https://www.blogger.com/post-edit.g?blogID=6830606489310006988&postID=3225449196447539119&from=pencil' title='Edit Post'>
<img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</span>
<div class='post-share-buttons goog-inline-block'>
</div>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
Labels:
<a href='https://htmlandphp.blogspot.com/search/label/ADDRESS%20tag' rel='tag'>ADDRESS tag</a>
</span>
</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
</span>
</div>
</div>
</div>
</div>
<div class='post-outer'>
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<meta content='6830606489310006988' itemprop='blogId'/>
<meta content='8113960281379343655' itemprop='postId'/>
<a name='8113960281379343655'></a>
<h3 class='post-title entry-title' itemprop='name'>
<a href='https://htmlandphp.blogspot.com/2009/03/blockquote-tag.html'>BLOCKQUOTE tag</a>
</h3>
<div class='post-header'>
<div class='post-header-line-1'></div>
</div>
<div class='post-body entry-content' id='post-body-8113960281379343655' itemprop='description articleBody'>
The HTML blockquote tags are used to define the HTML blockquote element. The HTML blockquote element begins with the HTML <blockquote> tag and ends with the HTML </blockquote> tag. The HTML blockquote element is used to format a block of text as a long quote which is indented more than the surrounding text on the left and the right.<br />HTML Blockquote Element Attributes<br /><br />HTML "blockquote" element attributes include:<br /><br /> * cite="uri" - Specifies the URI of the source of the quote.<br /> * class - The class attribute is used in conjunction with style sheets to associate an element with a class. The class attribute can set a class for specific element types or it can be independent of element types and work for all elements. The class attribute will provide the settings for specific style formatting. CSS properties are shown at the CSS Properties page.<br /> * ID - The ID attribute is used to apply style settings to specific individual HTML elements.<br /> * style - The style attribute is used to apply style settings for the specific element the style attribute is included with. An example is" <p style="font: 16pt courier"> - This sets the style or color of the text. This statement starts a paragraph with color, green: <p style="color: green">. The STYLE attribute is common to most HTML elements (See the CSS Properties page).<br /> * title - Used to give specific elements a title which may appear as a tooltip in some browsers when the mouse is held at or near the element. <br /><br />HTML Blockquote Element Contents<br /><br />The HTML blockquote element may contain other block elements such as headers, paragraphs, preformat blocks and tables. HTML block elements are listed at the HTML Block Elements. The HTML "blockquote" element may also contain the "script" element.<br />HTML Blockquote Element Inside<br /><br />The HTML blockquote element can be contained inside the elements "applet", "blockquote", "body", "button", "center", "del", "dd", "div", "fieldset", "form", "iframe", "ins", "li", "map", "noframes", "noscript", "object", "td", and "th". The HTML "blockquote" element should not be contained inside a paragraph element.<br />HTML Blockquote Element Use Example<br /><br />This is the HTML code:<br /><br /><p><br />The preamble of the Constitution says:<br><br /></p><br /><blockquote><br />We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<br /></blockquote><br /><br />This is how it looks:<br /><br />The preamble of the Constitution says:<br /><br /> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
<div style='clear: both;'></div>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
Posted by
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta content='https://www.blogger.com/profile/05809430139875726857' itemprop='url'/>
<a class='g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' title='author profile'>
<span itemprop='name'>html and php</span>
</a>
</span>
</span>
<span class='post-timestamp'>
at
<meta content='http://htmlandphp.blogspot.com/2009/03/blockquote-tag.html' itemprop='url'/>
<a class='timestamp-link' href='https://htmlandphp.blogspot.com/2009/03/blockquote-tag.html' rel='bookmark' title='permanent link'><abbr class='published' itemprop='datePublished' title='2009-03-03T01:51:00-08:00'>1:51 AM</abbr></a>
</span>
<span class='post-comment-link'>
<a class='comment-link' href='https://htmlandphp.blogspot.com/2009/03/blockquote-tag.html#comment-form' onclick=''>
No comments:
</a>
</span>
<span class='post-icons'>
<span class='item-control blog-admin pid-1323227177'>
<a href='https://www.blogger.com/post-edit.g?blogID=6830606489310006988&postID=8113960281379343655&from=pencil' title='Edit Post'>
<img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</span>
<div class='post-share-buttons goog-inline-block'>
</div>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
Labels:
<a href='https://htmlandphp.blogspot.com/search/label/BLOCKQUOTE%20tag' rel='tag'>BLOCKQUOTE tag</a>
</span>
</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
</span>
</div>
</div>
</div>
</div>
<div class='post-outer'>
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<meta content='6830606489310006988' itemprop='blogId'/>
<meta content='1286552739604618425' itemprop='postId'/>
<a name='1286552739604618425'></a>
<h3 class='post-title entry-title' itemprop='name'>
<a href='https://htmlandphp.blogspot.com/2009/03/cite-tag.html'>CITE tag</a>
</h3>
<div class='post-header'>
<div class='post-header-line-1'></div>
</div>
<div class='post-body entry-content' id='post-body-1286552739604618425' itemprop='description articleBody'>
The <cite> tag takes the selected block of text (a citation) and displays it in italics. Unlike the blockquote tag, the citation is not preceded or followed by paragraph breaks. So the citation remain inline. You may still need to use other HTML tags to effect the textual display and appearance that you desire.<br /> <br />It is recommended that you use the blockquote tag for long citations and the cite tag for short citations.<br /> <br />The closing tag is mandatory.<br /> <br />Core Attributes<br /> <br />class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
<div style='clear: both;'></div>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
Posted by
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta content='https://www.blogger.com/profile/05809430139875726857' itemprop='url'/>
<a class='g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' title='author profile'>
<span itemprop='name'>html and php</span>
</a>
</span>
</span>
<span class='post-timestamp'>
at
<meta content='http://htmlandphp.blogspot.com/2009/03/cite-tag.html' itemprop='url'/>
<a class='timestamp-link' href='https://htmlandphp.blogspot.com/2009/03/cite-tag.html' rel='bookmark' title='permanent link'><abbr class='published' itemprop='datePublished' title='2009-03-03T01:47:00-08:00'>1:47 AM</abbr></a>
</span>
<span class='post-comment-link'>
<a class='comment-link' href='https://htmlandphp.blogspot.com/2009/03/cite-tag.html#comment-form' onclick=''>
No comments:
</a>
</span>
<span class='post-icons'>
<span class='item-control blog-admin pid-1323227177'>
<a href='https://www.blogger.com/post-edit.g?blogID=6830606489310006988&postID=1286552739604618425&from=pencil' title='Edit Post'>
<img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</span>
<div class='post-share-buttons goog-inline-block'>
</div>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
Labels:
<a href='https://htmlandphp.blogspot.com/search/label/CITE%20tag' rel='tag'>CITE tag</a>
</span>
</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
</span>
</div>
</div>
</div>
</div>
<div class='post-outer'>
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<meta content='6830606489310006988' itemprop='blogId'/>
<meta content='2218651723001619728' itemprop='postId'/>
<a name='2218651723001619728'></a>
<h3 class='post-title entry-title' itemprop='name'>
<a href='https://htmlandphp.blogspot.com/2009/03/dfn-tag.html'>DFN tag</a>
</h3>
<div class='post-header'>
<div class='post-header-line-1'></div>
</div>
<div class='post-body entry-content' id='post-body-2218651723001619728' itemprop='description articleBody'>
Note: If you don't know what a tag is and/or how you must use it we recommend you to read our HTML tags and attributes tutorial that you can find in our HTML tutorials section.<br /><br />Table of contents<br /><br /> * Description<br /> * Attributes<br /> * Events<br /> * Examples<br /><br /> <br /><br />Description<br />The HTML dfn tag indicates that this is the defining instance of the term enclosed by the tags.<br /><br />Attributes<br />id (name)<br />The "id" attribute assigns an identifier to the associated element. This identifier must be unique in the document and can be used to refer to that element.<br /><br />Example:<br /><br />Code begin <p id="paragraph1">This is the first paragraph named as paragraph1. To dynamically change its properties use this identifier.</p>Code end<br /> <br /> <br /><br />class (cdata)<br />The "class" attribute assigns a class name (or a list of class names separated by spaces) to the container element. It's used with style sheets and tells the browser the class to which the element is associated with. A class gives visual attributes to elements.<br /><br />Example:<br /><br />Code begin <p class="references">This article is based on the book "Wind in the trees" by Jhon L. Brooks</p><br /><br /><p class="references important">This article is based on the book "Wind in the trees" by Jhon L. Brooks... and is more important than the one before.</p>Code end<br /> <br /> <br /><br />style (style)<br />Defines a visual style of this element. Is a better practice to define styles attributes in external style sheets grouping them in classes. Attributes in the "style" parameter must preserve this order "name : value" and be separated by a semi-colon.<br /><br />If you're writing XHTML code it's recommended not to use this attribute and try style sheet classes (with the "class" attribute).<br /><br />Example:<br /><br />Code begin <p style="color: #0000FF; font-size: 12pt">This is a paragraph with a defined style</p><br /><p>And this is another text without style.</p>Code end<br /> <br /> <br /><br />title (text)<br />Indicates a title for the element. Used to give a short description about the element that is usually shown as a "tool tip" when the user put the mouse pointer over the element.<br /><br />Example:<br /><br />Code View<br /><a title="HTMLQuick.com" href="http://www.htmlquick.com">HTML code</a> HTML code<br /> <br /><br />lang (langcode)<br />Specifies the language of an element's content. The default value in "unknown".<br /><br />When writing XHTML code the syntax "xml:lang" represents a preferred alternative in XHTML 1.0 and a replacement in XHTML 1.1 (e.g., xml:lang="en").<br /><br />Example:<br /><br />Code begin <p lang="en">This is a paragraph in english.</p><br /><p lang="es">Este es un párrafo en español.</p>Code end<br /> <br /> <br /><br />dir<br />Specifies the text direction of the element's contents and attribute values, as well as tables directionality. It has two possible values that are case insensitive:<br /><br /> * RTL: Right to left.<br /> * LTR: Left to right.<br /><br />Example:<br /><br />Code begin <q lang="he" dir="rtl">...a Hebrew quotation...</q>Code end<br /> <br /> <br /><br /><br />Events<br /><br /> * onclick<br /> * ondblclick<br /> * onmousedown<br /> * onmouseup<br /> * onmouseover<br /> * onmousemove<br /> * onmouseout<br /> * onkeypress<br /> * onkeydown<br /> * onkeyup<br /><br />See complete list and information about events in HTML<br /><span style="font-weight:bold;"><br />Events in HTML</span><br /><br />As well as attributes, events can be defined in HTML tags. Events, instead of giving values to the elements like the attributes, trigger actions when they occurs. These actions are defined by client-side scripts that are programs written to perform some action in a specific language (e.g., JavaScript, VBScript, etc.). There are different events that occurs in different instances according to browsers or users actions.<br /><br /><span style="font-weight:bold;">List of events</span><br /><br />Below is al list of all events available for the HTML 4.01 Standard.<br /><br /> * onload: The onload event occurs when the user agent finishes loading a window or all frames within a frameset.<br /> * onunload: The onunload event occurs when the user agent removes a document from a window or frame.<br /> * onclick: The onclick event is triggered when the mouse button is clicked over the element.<br /> * ondblclick: The ondblclick event occurs when the pointing device button is double clicked over an element.<br /> * onmousedown: The onmousedown event is triggered when the mouse button is pressed over the element.<br /> * onmouseup: The onmouseup event occurs when the pointing device button is released over an element.<br /> * onmouseover: The onmouseover event is triggered when the mouse is moved onto the element.<br /> * onmousemove: The onmousemove event occurs when the pointing device is moved while it is over an element.<br /> * onmouseout: The onmouseout event is triggered when the mouse is moved away from the element.<br /> * onfocus: The onfocus event occurs when an element receives focus either by the pointing device or by tabbing navigation.<br /> * onblur: The onblur event is triggered when an element loses focus either by the pointing device or by tabbing navigation.<br /> * onkeypress: The onkeypress event occurs when a key is pressed and released over an element.<br /> * onkeydown: The onkeydown event is triggered when a key is pressed down over the element.<br /> * onkeyup: The onkeyup event occurs when a key is released over an element.<br /> * onsubmit: The onsubmit event is triggered when a form is submitted.<br /> * onreset: The onreset event occurs when a form is reset.<br /> * onselect: The onselect event is triggered when a user selects some text in a text field.<br /> * onchange: The onchange event occurs when a control loses the input focus and its value has been modified since gaining focus.
<div style='clear: both;'></div>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
Posted by
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta content='https://www.blogger.com/profile/05809430139875726857' itemprop='url'/>
<a class='g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' title='author profile'>
<span itemprop='name'>html and php</span>
</a>
</span>
</span>
<span class='post-timestamp'>
at
<meta content='http://htmlandphp.blogspot.com/2009/03/dfn-tag.html' itemprop='url'/>
<a class='timestamp-link' href='https://htmlandphp.blogspot.com/2009/03/dfn-tag.html' rel='bookmark' title='permanent link'><abbr class='published' itemprop='datePublished' title='2009-03-03T01:43:00-08:00'>1:43 AM</abbr></a>
</span>
<span class='post-comment-link'>
<a class='comment-link' href='https://htmlandphp.blogspot.com/2009/03/dfn-tag.html#comment-form' onclick=''>
No comments:
</a>
</span>
<span class='post-icons'>
<span class='item-control blog-admin pid-1323227177'>
<a href='https://www.blogger.com/post-edit.g?blogID=6830606489310006988&postID=2218651723001619728&from=pencil' title='Edit Post'>
<img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</span>
<div class='post-share-buttons goog-inline-block'>
</div>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
Labels:
<a href='https://htmlandphp.blogspot.com/search/label/DFN%20tag' rel='tag'>DFN tag</a>
</span>
</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
</span>
</div>
</div>
</div>
</div>
</div></div>
</div>
<div class='blog-pager' id='blog-pager'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' href='https://htmlandphp.blogspot.com/' id='Blog1_blog-pager-newer-link' title='Newer Posts'>Newer Posts</a>
</span>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' href='https://htmlandphp.blogspot.com/search?updated-max=2009-03-03T01:43:00-08:00&max-results=7' id='Blog1_blog-pager-older-link' title='Older Posts'>Older Posts</a>
</span>
<a class='home-link' href='https://htmlandphp.blogspot.com/'>Home</a>
</div>
<div class='clear'></div>
<div class='blog-feeds'>
<div class='feed-links'>
Subscribe to:
<a class='feed-link' href='https://htmlandphp.blogspot.com/feeds/posts/default' target='_blank' type='application/atom+xml'>Posts (Atom)</a>
</div>
</div>
</div><div class='widget HTML' data-version='1' id='HTML6'>
<div class='widget-content'>
<script type="text/javascript"><!--
google_ad_client = "pub-1256546257762480";
google_ad_host = "pub-1556223355139109";
google_ad_host_channel="00000";
/* 728x90, created 2/4/09 */
google_ad_slot = "4059224962";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>
</div>
<div class='clear'></div>
</div><div class='widget HTML' data-version='1' id='HTML7'>
<div class='widget-content'>
<script type="text/javascript"><!--
google_ad_client = "pub-1256546257762480";
google_ad_host = "pub-1556223355139109";
google_ad_host_channel="00000";
/* 468x15, created 6/3/09 */
google_ad_slot = "3264085955";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>
</div>
<div class='clear'></div>
</div><div class='widget HTML' data-version='1' id='HTML8'>
<div class='widget-content'>
<script type="text/javascript"><!--
google_ad_client = "pub-1256546257762480";
google_ad_host = "pub-1556223355139109";
google_ad_host_channel="00000";
/* 468x15, created 6/3/09 */
google_ad_slot = "8450971202";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>
</div>
<div class='clear'></div>
</div><div class='widget HTML' data-version='1' id='HTML4'>
<div class='widget-content'>
<script type="text/javascript"><!--
google_ad_client = "pub-1256546257762480";
google_ad_host = "pub-1556223355139109";
google_ad_host_channel="00000";
/* 468x60, created 6/6/09 */
google_ad_slot = "7296569841";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>
</div>
<div class='clear'></div>
</div></div>
</div>
<div id='sidebar-wrapper'>
<div class='sidebar section' id='sidebar'><div class='widget HTML' data-version='1' id='HTML9'>
<div class='widget-content'>
<script type="text/javascript"><!--
google_ad_client = "pub-1256546257762480";
google_ad_host = "pub-1556223355139109";
google_ad_host_channel="00000";
/* 728x15, created 6/25/09 */
google_ad_slot = "9867675205";
google_ad_width = 728;
google_ad_height = 15;
//-->
</script>
<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>
</div>
<div class='clear'></div>
</div><div class='widget HTML' data-version='1' id='HTML5'>
<div class='widget-content'>
<script type="text/javascript"><!--
google_ad_client = "pub-1256546257762480";
google_ad_host = "pub-1556223355139109";
google_ad_host_channel="00000";
/* 160x600, created 6/25/09 */
google_ad_slot = "2027759025";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>
</div>
<div class='clear'></div>
</div><div class='widget HTML' data-version='1' id='HTML2'>
<h2 class='title'>search results</h2>
<div class='widget-content'>
<div id="cse-search-results"></div>
<script type="text/javascript">
var googleSearchIframeName = "cse-search-results";
var googleSearchFormName = "cse-search-box";
var googleSearchFrameWidth = 800;
var googleSearchDomain = "www.google.com";
var googleSearchPath = "/cse";
</script>
<script src="//www.google.com/afsonline/show_afs_search.js" type="text/javascript"></script>
</div>
<div class='clear'></div>
</div><div class='widget Followers' data-version='1' id='Followers2'>
<h2 class='title'>Followers</h2>
<div class='widget-content'>
<div id='Followers2-wrapper'>
<div style='margin-right:2px;'>
<div><script type="text/javascript" src="https://apis.google.com/js/platform.js"></script>
<div id="followers-iframe-container"></div>
<script type="text/javascript">
window.followersIframe = null;
function followersIframeOpen(url) {
gapi.load("gapi.iframes", function() {
if (gapi.iframes && gapi.iframes.getContext) {
window.followersIframe = gapi.iframes.getContext().openChild({
url: url,
where: document.getElementById("followers-iframe-container"),
messageHandlersFilter: gapi.iframes.CROSS_ORIGIN_IFRAMES_FILTER,
messageHandlers: {
'_ready': function(obj) {
window.followersIframe.getIframeEl().height = obj.height;
},
'reset': function() {
window.followersIframe.close();
followersIframeOpen("https://www.blogger.com/followers/frame/6830606489310006988?colors\x3dCgt0cmFuc3BhcmVudBILdHJhbnNwYXJlbnQaByMwMDAwMDAiByM5OTk5OTkqByNmNmY2ZjYyByM5RTUyMDU6ByMwMDAwMDBCByM5OTk5OTlKByMwMDAwMDBSByM5OTk5OTlaC3RyYW5zcGFyZW50\x26pageSize\x3d21\x26hl\x3den\x26origin\x3dhttps://htmlandphp.blogspot.com");
},
'open': function(url) {
window.followersIframe.close();
followersIframeOpen(url);
},
'blogger-ping': function() {
}
}
});
}
});
}
followersIframeOpen("https://www.blogger.com/followers/frame/6830606489310006988?colors\x3dCgt0cmFuc3BhcmVudBILdHJhbnNwYXJlbnQaByMwMDAwMDAiByM5OTk5OTkqByNmNmY2ZjYyByM5RTUyMDU6ByMwMDAwMDBCByM5OTk5OTlKByMwMDAwMDBSByM5OTk5OTlaC3RyYW5zcGFyZW50\x26pageSize\x3d21\x26hl\x3den\x26origin\x3dhttps://htmlandphp.blogspot.com");
</script></div>
</div>
</div>
<div class='clear'></div>
</div>
</div><div class='widget BlogArchive' data-version='1' id='BlogArchive2'>
<h2>Blog Archive</h2>
<div class='widget-content'>
<div id='ArchiveList'>
<div id='BlogArchive2_ArchiveList'>
<ul class='hierarchy'>
<li class='archivedate expanded'>
<a class='toggle' href='javascript:void(0)'>
<span class='zippy toggle-open'>
▼ 
</span>
</a>
<a class='post-count-link' href='https://htmlandphp.blogspot.com/2009/'>
2009
</a>
<span class='post-count' dir='ltr'>(51)</span>
<ul class='hierarchy'>
<li class='archivedate expanded'>
<a class='toggle' href='javascript:void(0)'>
<span class='zippy toggle-open'>
▼ 
</span>
</a>
<a class='post-count-link' href='https://htmlandphp.blogspot.com/2009/03/'>
March
</a>
<span class='post-count' dir='ltr'>(15)</span>
<ul class='posts'>
<li><a href='https://htmlandphp.blogspot.com/2009/03/introduction-to-html.html'>introduction to HTML</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/what-is-html.html'>What is HTML</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/basic-html-tags.html'>Basic HTML Tags</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/text-formating-tags.html'>Text Formating tags</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/pre-tag.html'>PRE tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/code-tag.html'>CODE tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/kbd-tag.html'>KBD tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/samp-tag.html'>SAMP tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/tt-tag.html'>TT tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/plaintext-tag.html'>PLAINTEXT tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/xmp-tag.html'>XMP tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/address-tag.html'>ADDRESS tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/blockquote-tag.html'>BLOCKQUOTE tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/cite-tag.html'>CITE tag</a></li>
<li><a href='https://htmlandphp.blogspot.com/2009/03/dfn-tag.html'>DFN tag</a></li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<span class='zippy'>
► 
</span>
</a>
<a class='post-count-link' href='https://htmlandphp.blogspot.com/2009/02/'>
February
</a>
<span class='post-count' dir='ltr'>(23)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<span class='zippy'>
► 
</span>
</a>
<a class='post-count-link' href='https://htmlandphp.blogspot.com/2009/01/'>
January
</a>
<span class='post-count' dir='ltr'>(13)</span>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div class='clear'></div>
</div>
</div><div class='widget Profile' data-version='1' id='Profile2'>
<h2>About Me</h2>
<div class='widget-content'>
<dl class='profile-datablock'>
<dt class='profile-data'>
<a class='profile-name-link g-profile' href='https://www.blogger.com/profile/05809430139875726857' rel='author' style='background-image: url(//www.blogger.com/img/logo-16.png);'>
html and php
</a>
</dt>
</dl>
<a class='profile-link' href='https://www.blogger.com/profile/05809430139875726857' rel='author'>View my complete profile</a>
<div class='clear'></div>
</div>
</div><div class='widget HTML' data-version='1' id='HTML1'>
<div class='widget-content'>
<style type="text/css">
@import url(//www.google.com/cse/api/branding.css);
</style>
<div style="background-color:#999999;color:#000000" class="cse-branding-bottom">
<div class="cse-branding-form">
<form id="cse-search-box" action="http://htmlandphp.blogspot.com/">
<div>
<input value="partner-pub-1256546257762480:av7223ypi6y" name="cx" type="hidden"/>
<input value="FORID:11" name="cof" type="hidden"/>
<input value="ISO-8859-1" name="ie" type="hidden"/>
<input name="q" size="31" type="text"/>
<input value="Search" name="sa" type="submit"/>
</div>
</form>
</div>
<div class="cse-branding-logo">
<img alt="Google" src="//www.google.com/images/poweredby_transparent/poweredby_999999.gif">
</div>
<div class="cse-branding-text">
Custom Search
</div>
</div>
</div>
<div class='clear'></div>
</div></div>
</div>
<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>
</div>
<!-- end content-wrapper -->
</div></div>
<!-- end outer-wrapper -->
<script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/91768132-widgets.js"></script>
<script type='text/javascript'>
window['__wavt'] = 'AOuZoY7hwSuRCmI_j-IUspZcuaRyHrpw5Q:1737166090223';_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d6830606489310006988','//htmlandphp.blogspot.com/2009/03/','6830606489310006988');
_WidgetManager._SetDataContext([{'name': 'blog', 'data': {'blogId': '6830606489310006988', 'title': 'htmlandphp', 'url': 'https://htmlandphp.blogspot.com/2009/03/', 'canonicalUrl': 'http://htmlandphp.blogspot.com/2009/03/', 'homepageUrl': 'https://htmlandphp.blogspot.com/', 'searchUrl': 'https://htmlandphp.blogspot.com/search', 'canonicalHomepageUrl': 'http://htmlandphp.blogspot.com/', 'blogspotFaviconUrl': 'https://htmlandphp.blogspot.com/favicon.ico', 'bloggerUrl': 'https://www.blogger.com', 'hasCustomDomain': false, 'httpsEnabled': true, 'enabledCommentProfileImages': true, 'gPlusViewType': 'FILTERED_POSTMOD', 'adultContent': false, 'analyticsAccountNumber': '', 'encoding': 'UTF-8', 'locale': 'en', 'localeUnderscoreDelimited': 'en', 'languageDirection': 'ltr', 'isPrivate': false, 'isMobile': false, 'isMobileRequest': false, 'mobileClass': '', 'isPrivateBlog': false, 'isDynamicViewsAvailable': true, 'feedLinks': '\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22htmlandphp - Atom\x22 href\x3d\x22https://htmlandphp.blogspot.com/feeds/posts/default\x22 /\x3e\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/rss+xml\x22 title\x3d\x22htmlandphp - RSS\x22 href\x3d\x22https://htmlandphp.blogspot.com/feeds/posts/default?alt\x3drss\x22 /\x3e\n\x3clink rel\x3d\x22service.post\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22htmlandphp - Atom\x22 href\x3d\x22https://www.blogger.com/feeds/6830606489310006988/posts/default\x22 /\x3e\n', 'meTag': '', 'adsenseClientId': 'ca-pub-1256546257762480', 'adsenseHostId': 'ca-host-pub-1556223355139109', 'adsenseHasAds': true, 'adsenseAutoAds': false, 'boqCommentIframeForm': true, 'loginRedirectParam': '', 'view': '', 'dynamicViewsCommentsSrc': '//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js', 'dynamicViewsScriptSrc': '//www.blogblog.com/dynamicviews/d2c988fc3a56b1b1', 'plusOneApiSrc': 'https://apis.google.com/js/platform.js', 'disableGComments': true, 'interstitialAccepted': false, 'sharing': {'platforms': [{'name': 'Get link', 'key': 'link', 'shareMessage': 'Get link', 'target': ''}, {'name': 'Facebook', 'key': 'facebook', 'shareMessage': 'Share to Facebook', 'target': 'facebook'}, {'name': 'BlogThis!', 'key': 'blogThis', 'shareMessage': 'BlogThis!', 'target': 'blog'}, {'name': 'X', 'key': 'twitter', 'shareMessage': 'Share to X', 'target': 'twitter'}, {'name': 'Pinterest', 'key': 'pinterest', 'shareMessage': 'Share to Pinterest', 'target': 'pinterest'}, {'name': 'Email', 'key': 'email', 'shareMessage': 'Email', 'target': 'email'}], 'disableGooglePlus': true, 'googlePlusShareButtonWidth': 0, 'googlePlusBootstrap': '\x3cscript type\x3d\x22text/javascript\x22\x3ewindow.___gcfg \x3d {\x27lang\x27: \x27en\x27};\x3c/script\x3e'}, 'hasCustomJumpLinkMessage': false, 'jumpLinkMessage': 'Read more', 'pageType': 'archive', 'pageName': 'March 2009', 'pageTitle': 'htmlandphp: March 2009'}}, {'name': 'features', 'data': {}}, {'name': 'messages', 'data': {'edit': 'Edit', 'linkCopiedToClipboard': 'Link copied to clipboard!', 'ok': 'Ok', 'postLink': 'Post Link'}}, {'name': 'template', 'data': {'isResponsive': false, 'isAlternateRendering': false, 'isCustom': false}}, {'name': 'view', 'data': {'classic': {'name': 'classic', 'url': '?view\x3dclassic'}, 'flipcard': {'name': 'flipcard', 'url': '?view\x3dflipcard'}, 'magazine': {'name': 'magazine', 'url': '?view\x3dmagazine'}, 'mosaic': {'name': 'mosaic', 'url': '?view\x3dmosaic'}, 'sidebar': {'name': 'sidebar', 'url': '?view\x3dsidebar'}, 'snapshot': {'name': 'snapshot', 'url': '?view\x3dsnapshot'}, 'timeslide': {'name': 'timeslide', 'url': '?view\x3dtimeslide'}, 'isMobile': false, 'title': 'htmlandphp', 'description': '', 'url': 'https://htmlandphp.blogspot.com/2009/03/', 'type': 'feed', 'isSingleItem': false, 'isMultipleItems': true, 'isError': false, 'isPage': false, 'isPost': false, 'isHomepage': false, 'isArchive': true, 'isLabelSearch': false, 'archive': {'year': 2009, 'month': 3, 'rangeMessage': 'Showing posts from March, 2009'}}}]);
_WidgetManager._RegisterWidget('_NavbarView', new _WidgetInfo('Navbar1', 'navbar', document.getElementById('Navbar1'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HeaderView', new _WidgetInfo('Header1', 'header', document.getElementById('Header1'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML3', 'crosscol', document.getElementById('HTML3'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML10', 'main', document.getElementById('HTML10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML14', 'main', document.getElementById('HTML14'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML15', 'main', document.getElementById('HTML15'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_BlogView', new _WidgetInfo('Blog1', 'main', document.getElementById('Blog1'), {'cmtInteractionsEnabled': false, 'lightboxEnabled': true, 'lightboxModuleUrl': 'https://www.blogger.com/static/v1/jsbin/599103511-lbx.js', 'lightboxCssUrl': 'https://www.blogger.com/static/v1/v-css/1964470060-lightbox_bundle.css'}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML6', 'main', document.getElementById('HTML6'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML7', 'main', document.getElementById('HTML7'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML8', 'main', document.getElementById('HTML8'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML4', 'main', document.getElementById('HTML4'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML9', 'sidebar', document.getElementById('HTML9'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML5', 'sidebar', document.getElementById('HTML5'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML2', 'sidebar', document.getElementById('HTML2'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_FollowersView', new _WidgetInfo('Followers2', 'sidebar', document.getElementById('Followers2'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_BlogArchiveView', new _WidgetInfo('BlogArchive2', 'sidebar', document.getElementById('BlogArchive2'), {'languageDirection': 'ltr', 'loadingMessage': 'Loading\x26hellip;'}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_ProfileView', new _WidgetInfo('Profile2', 'sidebar', document.getElementById('Profile2'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML1', 'sidebar', document.getElementById('HTML1'), {}, 'displayModeFull'));
</script>
</body>
</html>