What is HTML?
HTML is a language for describing web pages.
- HTML stands for Hyper Text Markup Language
- HTML is not a programming language, it is a markup language
- A markup language is a set of markup tags
- HTML uses markup tags to describe web pages
HTML Tags
HTML markup tags are usually called HTML tags
- HTML tags are keywords surrounded by angle brackets like <html>
- HTML tags normally come in pairs like <b> and </b>
- The first tag in a pair is the start tag, the second tag is the end tag
- Start and end tags are also called opening tags and closing tags
HTML Documents = Web Pages
- HTML documents describe web pages
- HTML documents contain HTML tags and plain text
- HTML documents are also called web pages
The purpose of a web browser (like Internet Explorer or Firefox) is to read HTML documents and display them as web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page:
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Example Explained
- The text between <html> and </html> describes the web page
- The text between <body> and </body> is the visible page content
- The text between <h1> and </h1> is displayed as a heading
- The text between <p> and </p> is displayed as a paragraph
What You Need
You don't need any tools to learn HTML at W3Schools.
- You don't need an HTML editor
- You don't need a web server
- You don't need a web site
Editing HTML
HTML can be written and edited using many different editors like Dreamweaver and Visual Studio.
However, in this tutorial we use a plain text editor (like Notepad) to edit HTML. We believe using a plain text editor is the best way to learn HTML.
Create Your Own Test Web
If you just want to learn HTML, skip the rest of this chapter.
If you want to create a test page on your own computer, just copy the 3 files below to your desktop.
(Right click on each link, and select "save target as" or "save link as")
<html>
<body>
<h1>This is my Main Page</h1>
<p>This is some text.</p>
<p><a href="page1.htm">This is a link to Page 1</a></p>
<p><a href="page2.htm">This is a link to Page 2</a></p>
</body>
</html>
<html>
<body>
<h1>This is Page1</h1>
<p>This is some text.</p>
</body>
</html>
<html>
<body>
<h1>This is Page2</h1>
<p>This is some text.</p>
</body>
</html>
After you have copied the files, you can double-click on the file called "mainpage.htm" and see your first web site in action.
.HTM or .HTML File Extension?
When you save an HTML file, you can use either the .htm or the .html file extension. There is no difference, it is entirely up to you.
HTML Headings
HTML headings are defined with the <h1> to <h6> tags.
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
HTML Paragraphs
HTML paragraphs are defined with the <p> tag.
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<p>This is another paragraph.</p>
HTML Links
HTML links are defined with the <a> tag.
<a href="http://www.w3schools.com">This is a link</a>
HTML Images
HTML images are defined with the <img> tag.
Example
<img src="w3schools.jpg" width="104" height="142" />
Note: The name and the size of the image are provided as attributes.
HTML Elements
An HTML element is everything from the start tag to the end tag:
| Start tag * | Element content | End tag * |
| <p> | This is a paragraph | </p> |
| <a href="default.htm" > | This is a link | </a> |
| <br /> | | |
* The start tag is often called the opening tag. The end tag is often called the closing tag.
Empty HTML Elements
HTML elements with no content are called empty elements.
<br> is an empty element without a closing tag (the <br> tag defines a line break).
Tip: In XHTML, all elements must be closed. Adding a slash inside the start tag, like <br />, is the proper way of closing empty elements in XHTML (and XML).
HTML Tip: Use Lowercase Tags
HTML tags are not case sensitive: <P> means the same as <p>. Many web sites use uppercase HTML tags.
W3Schools use lowercase tags because the World Wide Web Consortium (W3C) recommendslowercase in HTML 4, and demands lowercase tags in XHTML.
HTML Attributes
Attributes provide additional information about HTML elements.
- HTML elements can have attributes
- Attributes provide additional information about an element
- Attributes are always specified in the start tag
- Attributes come in name/value pairs like: name="value"
Example
<img src="w3schools.jpg" width="104" height="142" />
Always Quote Attribute Values
Attribute values should always be enclosed in quotes.
Double style quotes are the most common, but single style quotes are also allowed.
Tip: In some rare situations, when the attribute value itself contains quotes, it is necessary to use single quotes: name='John "ShotGun" Nelson'Ordered by Function
DTD: indicates in which HTML 4.01 / XHTML 1.0 DTD the tag is allowed. S=Strict, T=Transitional, and F=Frameset
| Tag | Description | DTD |
| Basic | | |
| Defines the document type | STF | |
| Defines an HTML document | STF | |
| Defines the document's body | STF | |
| Defines HTML headings | STF | |
| Defines a paragraph | STF | |
| Inserts a single line break | STF | |
| Defines a horizontal line | STF | |
| Defines a comment | STF | |
| Formatting | | |
| Defines an acronym | STF | |
| Defines an abbreviation | STF | |
| Defines contact information for the author/owner of a document | STF | |
| Defines bold text | STF | |
| Defines the text direction | STF | |
| Defines big text | STF | |
| Defines a long quotation | STF | |
| Deprecated. Defines centered text | TF | |
| Defines a citation | STF | |
| Defines computer code text | STF | |
| Defines deleted text | STF | |
| Defines a definition term | STF | |
| Defines emphasized text | STF | |
| Deprecated. Defines font, color, and size for text | TF | |
| Defines italic text | STF | |
| Defines inserted text | STF | |
| Defines keyboard text | STF | |
| Defines preformatted text | STF | |
| Defines a short quotation | STF | |
| Deprecated. Defines strikethrough text | TF | |
| Defines sample computer code | STF | |
| Defines small text | STF | |
| Deprecated. Defines strikethrough text | TF | |
| Defines strong text | STF | |
| Defines subscripted text | STF | |
| Defines superscripted text | STF | |
| Defines teletype text | STF | |
| Deprecated. Defines underlined text | TF | |
| Defines a variable part of a text | STF | |
| <xmp> | Deprecated. Defines preformatted text | |
| Forms | | |
| Defines an HTML form for user input | STF | |
| Defines an input control | STF | |
| Defines a multi-line text input control | STF | |
| Defines a push button | STF | |
| Defines a select list (drop-down list) | STF | |
| Defines a group of related options in a select list | STF | |
| Defines an option in a select list | STF | |
| Defines a label for an input element | STF | |
| Defines a border around elements in a form | STF | |
| Defines a caption for a fieldset element | STF | |
| Frames | | |
| Defines a window (a frame) in a frameset | F | |
| Defines a set of frames | F | |
| Defines an alternate content for users that do not support frames | TF | |
| Defines an inline frame | TF | |
| Images | | |
| Defines an image | STF | |
| Defines an image-map | STF | |
| Defines an area inside an image-map | STF | |
| Links | | |
| Defines an anchor | STF | |
| Defines the relationship between a document and an external resource | STF | |
| Lists | | |
| Defines an unordered list | STF | |
| Defines an ordered list | STF | |
| Defines a list item | STF | |
| Deprecated. Defines a directory list | TF | |
| Defines a definition list | STF | |
| Defines a term (an item) in a definition list | STF | |
| Defines a description of a term in a definition list | STF | |
| Deprecated. Defines a menu list | TF | |
| Tables | | |
| Defines a table | STF | |
| Defines a table caption | STF | |
| Defines a header cell in a table | STF | |
| Defines a row in a table | STF | |
| Defines a cell in a table | STF | |
| Groups the header content in a table | STF | |
| Groups the body content in a table | STF | |
| Groups the footer content in a table | STF | |
| Defines attribute values for one or more columns in a table | STF | |
| Defines a group of columns in a table for formatting | STF | |
| Styles | | |
| Defines style information for a document | STF | |
| Defines a section in a document | STF | |
| Defines a section in a document | STF | |
| Meta Info | | |
| Defines information about the document | STF | |
| Defines the document title | STF | |
| Defines metadata about an HTML document | STF | |
| Defines a default address or a default target for all links on a page | STF | |
| Deprecated. Defines a default font, color, or size for the text in a page | TF | |
| Programming | | |
| Defines a client-side script | STF | |
| Defines an alternate content for users that do not support client-side scripts | STF | |
| Deprecated. Defines an embedded applet | TF | |
| Defines an embedded object | STF | |
| Defines a parameter for an object | STF |
haiyyyy
ReplyDelete
ReplyDeletehttps://www.welookups.com/tags/tag_comment.html