Beginning HTML Tags!
A web browser reads an HTML document top to bottom, left to right. Each time the browser finds a tag, it is displayed accordingly (paragraphs look like paragraphs, tables look like tables, etc). Tags have 3 major parts: opening tag(s), content(s), and closing tag(s). Recall that a completed tag is termed an element. By adding tags to an HTML document, you signal to the browser "Hey look, I'm a paragraph tag, now treat me as such."
As you will learn, there are probably hundreds of HTML Tags. Tables, images, lists, forms, and everything else being displayed on an web page requires the use of a tag or two.
HTML Code:
HTML Tags:
There are a few tags that do not follow the mold above. In a way, they still have the 3 parts (opening/closing and content). These tags however do not require a formal </closingtag> but rather a modified version. The reason being that these tags do not really require any content. Rather some of them just need a source URL and this is enough information for the web browser to display the tag properly (image tags). Let's take a look at a line break tag.
HTML Code:
HTML Code:
--Line Break--
As you can see from the above image tag, your browser is completely capable of interpreting this tag so long as we tell the browser where the image is located using the src attribute. More on attributes in the next lesson.
A web browser reads an HTML document top to bottom, left to right. Each time the browser finds a tag, it is displayed accordingly (paragraphs look like paragraphs, tables look like tables, etc). Tags have 3 major parts: opening tag(s), content(s), and closing tag(s). Recall that a completed tag is termed an element. By adding tags to an HTML document, you signal to the browser "Hey look, I'm a paragraph tag, now treat me as such."
As you will learn, there are probably hundreds of HTML Tags. Tables, images, lists, forms, and everything else being displayed on an web page requires the use of a tag or two.
HTML Code:
<openingtag>Content</closingtag>Tags should be lower-case letters if you plan on publishing your work. This is the standard for XHTML and Dynamic HTML. Here's quick look at some HTML tags.
<p>A Paragraph Tag</p>
HTML Tags:
<body>Body Tag (acts as a content shell)Tags Without Closing Tags
<p>Paragraph Tag</p>
<h2>Heading Tag</h2>
<b>Bold Tag</b>
<i>Italic Tag</i>
</body>
There are a few tags that do not follow the mold above. In a way, they still have the 3 parts (opening/closing and content). These tags however do not require a formal </closingtag> but rather a modified version. The reason being that these tags do not really require any content. Rather some of them just need a source URL and this is enough information for the web browser to display the tag properly (image tags). Let's take a look at a line break tag.
HTML Code:
<br />To tell the browser we want to place a line break (carriage return) onto the site, it is not necessary to type <br>linebreak</br>. If every line break tag needed all three components as other do, life would become redundant real quick. Instead the better solution was to combine the opening and closing tags into a single format. Other tags have also been modified such as the image tag and input tag.
HTML Code:
<img src="../mypic.jpg" /> -- Image TagDisplay:
<br /> -- Line Break Tag
<input type="text" size="12" /> -- Input Field
--Line Break--
As you can see from the above image tag, your browser is completely capable of interpreting this tag so long as we tell the browser where the image is located using the src attribute. More on attributes in the next lesson.
