|
A Tag is a piece of code that defines a particular element in a web-page. A browser uses the tags in an HTML document to determine the overall appearance of a web-page. All tags follow the same structure and have an opening and closing statement when they contain text content or other tags. Tags that don't contain text may be closed immediately in a single statement. Missing or improper opening or closing statements may, and generally do, cause a web-page to appear distorted or not at all
Opening Statement Closing statement
<xxxx> </xxxx>
Tags without text content
<xxxx />
Common Tags
<html></html> : these are the opening and closing statements that tell a browser it is viewing an html page. these are absolutely required at the very beginning and very end of every web-page.
<head></head> : the head tags in an HTML doc come after the opening html tag. This tag is used to contain tag elements that are not displayed to a viewer but are important to the page. These would include.
<title></title> the title of the webpage
<style></style>Styling information for text and images
<meta></meta> meta tags are used to define keywords, descriptions and other search engine data
<script></script> the script tag is used to define functions that will run when a viewer performs a particular action. Such as a roll-over image.
<body></body> : the body tags come after the head closing statement. these contain all the elements of the web-page that make up what the end user sees on the webpage. some of the elements contained within that we will cover in this class include:
<table></table> this tag starts a layout table. It contains the following two types of tags
<tr></tr> starts a row in the table to contain the cells
<td></td> the cell within a row of a table. content is placed directly into this tag
<img /> this tag defines an image and cannot contain text data
<p></p> this tag defines a paragraph
<a></a> this tag defines a link
<br /> this tag forces a new line in a paragraph
<span></span> this tag defines a span of text content. the tag is usually used to apply a style to a text element.
Proper Nesting of tags
All tags need to be properly nested within one another. This means that each tag must contain both the opening and closing statements of all tags within it. The examples below demonstrate this point.
Correct nesting of tags
<html>
<head>
<title>page title</title>
</head>
<body>
<table>
<tr>
<td>content box</td>
</tr>
</table>
</body>
</html>
Incorrect nesting of tags (can you find the 2 errors in this code?)
<html>
<head>
<title>page title</title>
<body>
</head>
<table>
<tr>
<td>content box
</tr>
</td>
</table>
</body>
</html>
|