Applying HTML ( How does it work ? )

Hello all, still have a passion for learning? I hope so :) Okay, on the posting i made before, we already know the tags which generally used when creating a website. Well, for now let us learn to use it. I'll try to explain the following in this example. Remember to try it your self because when you accustomed write the code, it's become very easy. :) Oke, cek this out..


Some things to note in writing HTML are:

1. Don't forget to always close the tag, although the browser can still display the appropriate result, but familiarize to always close the tag.
2. Always use lowercase, because it will be very useful if you use an HTML 5 or XHTML.
3. Always give quotes to the attributes of the element or tag.
4. Ellement attributes are case-sensitive, which means the writing of "example" with "Example" is something different.

The first is heading tags

The heading tags is <h1> to <h6>. The <h1> means the biggest text will appear, and the <h6> means the smallest text between the heading tags. Take a look to this sample.

<h1>This is heading</h1>

This is heading

<h2>This is heading</h2>

This is heading

<h3>This is heading</h3>

This is heading

<h4>This is heading</h4>

This is heading

<h5>This is heading</h5>

This is heading

<h6>This is heading</h6>

This is heading

Note: The browser will automatically add a space before and after heading. This can be changed using CSS.

Horizontal Line Tags

To create a horizontal line, use the <hr /> tags. This tags will create a horizontal line in HTML page. For an example :

<hr />

and the result is below

---

Comment Tags

HTML comments can be provided by adding a <!-- Create your text here -->tags

Paragraph Tags

<p> tags is use to create a new paragraph on an HTML page. The browser will automatically add new lines before and after the tag. Let's see the example below :

<p>This is a paragraph</p>

This is a paragraph

<p>The next paragraph</p>

The next paragraph

Line Break Tags

<br /> tags is use to create a new line without having to add a paragraph. <br /> tags is an empty HTML element, which means can not be given attributes. Then it is highly recommended to add a slash after the br.

Hyperlink Tags

To add a link, use the <a> tags. In order to open link in a new tab, add a attribute target = "_blank". For more details, see example:

--> This link will open in the same page.

Web Learning

--> This link will open in the new tab

Web Learning

Image Tags

To add an image in an HTML page, use the <img> tags. Location of the image placed on the attribute href = "". Here's an example of using <img> tags and attributes commonly used:

<img href="http://mywebsite.com/img/example.jpg" border="0" width="64" height="64" />

Explanation :

src="http://mywebsite.com/img/example.jpg" --> The location of the image to be inserted into HTML pages.

border="0" --> Indicates that there is no border around the image. To give the border, then just replace the zero with 1,2,3 or whatever according to the desired thickness.

width="64" --> Attribute to specify the width of the image will be displayed.

height="64" --> Attribute to determine the height of the image to be displayed.

Note: <img> tags are single tag, so always add a slash after the attribute.

Table Tags

<table> tags used to create tables. To declare the table row, use <tr> tag, and for the column, then use <td> tags. Lets see the example below :

<table>

<tr><td>Put some Content Here</td></tr>

</table>

Put some Content Here

When using the table tags, u can place a table iside a table. An u can manipulate the row or the columns freely. To make that, use the "rowspan" or "colspan" atribut.

Oke guys, i think it's enough for today. Just remember, keep your spirit to learn.

And the last. Happy Coding All :)

Read More