General Shape and Basic HTML Tag Functions

  No comments
Hyper Text Markup Language (HTML) is a markup language used to create a web page, displaying various information within an Internet browser and formatting simple hypertext written in ASCII format files in order to generate an integrated view of the form. In other words, files are created in word processing software and stored in normal ASCII format so that it becomes a web page with HTML commands. Starting from a widely used language in the publishing and printing world called SGML (Standard Generalized Markup Language), HTML is a widely used standard for displaying web pages. HTML is currently an Internet standard defined and controlled for use by the World Wide Web Consortium (W3C). HTML was created by the collaboration of Caillau TEAM with Berners-lee Robert when they worked at CERN in 1989 (CERN is a high energy physics research institute in Geneva). [Wikipedia], to learn basic HTML you should type in Notepad.


General forms:

<html>
<head>
 <title> Website Title </title>
</head>
<body>
        
It's the page of your site.

         fill
the HTML commands here.
</body>
</html>

When done typing, save with the name example.html remember the extension. Html and on the note pad select All types (*. *). To check it you double click the file you have saved. Actually you can use the .htm extension, but to be the same, you should use the .html extension.

 
Try you type the following HTML commands, then you run in the browser!

<html>
<head>
   <title> My first Training</title>
</head>
<body bg color="#000000">
    <p align="left">
          This paragraph will be flat left <br> <br>

        
<p> br is used to replace lines <br> <br>

        
<b> This sentence will be printed Bold </ b> <br>

        
<i> This sentence will be printed Italic </ i> <br>

        
<b> <i> This sentence will be printed Bold and Italic </ i> </ b>

    <hr width="1000"><br>
 The hr command is used to create lines
 
</body>
</html>

Save your work with the name of example_2.html. If true, the result should be displayed as shown below:



Figure 1.2 Results from example_2.html



Consider the following command:

     <p align = "left">


P in the above command is called tag, while align is called with attribute. The attribute is the command that accompanies the tag.


Here are some HTML commands and their functions:


Tag
Atribut/Contoh penulisan
Fungsi
<body>
<body bgcolor=”red”>
<body bgcolor=”#FF0000”>

text=” ... “ link=” ...” vlink=”...”
alink=”...”

<body
background=”D:\Gambar.jpg”>
Backgorund halaman berwarna merah

Memberi warna pada teks
Warna link
Warna link yang sudah dikunjungi
Warna link yang aktif

Memberi background gambar pada halaman
<a> ... </a>

<a href=”D:\home.html”>Home</a>
<a
href="http://www.yahoo.com/">Ya hoo!</a> <a href="mailto:name@domain.com" >here</a> to email me!
Membuat hyperlink/link

<img>
<img src="person.jpg" width="50" height="50" border="0"
alt="Person" align="left">


Memasukkan gambar dengan nama file gambar person.jpg, lebar 50px, tinggi 50px, border 0, rata kiri, dan jika gambar tidak muncul akan keluar teks Person


<img src=”C:\Documents and
Settings\All Users\Documents\My
Pictures\Sample
Pictures\Sunset.jpg>


<font>... /font>


<FONT size="2" color="#FFFF00" face="arial">...</font>
Mengatur font dengan ukuran 2, warna kuning, jenis huruf Arial
<BIG>...</BIG>
<BIG>Contoh </BIG>
Membuat teks Contoh menjadi lebih besar
<SMALL>...</SMALL>
<SMALL> Contoh</SMALL>
Membuat teks Contoh menjadi
lebih kecil
<b>...</b>
Teks bold/dicetak lebih tebal

<i>…</i>
Teks italic/miring

<strike>...</strike>
Teks tercoret

<u>...</u>
Teks underlined

<h1>...</h1>
Teks heading 1. Tingkat heading bisa sampai tingkat 6. Semakin besar tingkar heading, maka teks aka dicetak semakin kecil

<hr>
<hr width=”600”>




<hr align=”center” size=”5” width=”80%” 
Garis dengan lebar 600. Tag <hr>
tidak perlu ditutup

Garis dengan tinggi 5, lebar 80% dari lebar layar browser dan rata tengah

<p align=”center’> ...
</p>
Paragraf rata tengah. Perintah ini juga dapat ditulis dengan tag
<center>...</center>




<br>
Tag untuk ganti baris
Tag <br> tidak perlu ditutup
<sup>...</sup>
Teks superscript

<sub>...</sub>
Teks subscript

<marquee> .... 
</marquee>
Teks berjalan. Memiliki atribut direction, behavior dan lain-lain.
Contoh:
<marquee direction=”right”>
....</marquee>
<marquee behavior=”alternate”>
... </marquee>





TABLE


Some important commands for creating tables:

1. <table border = "1"> .... </ table> is the main command in the creation of tables, tables with a thickness of 1px

2. <tr> ... </ tr> tag to create a row

3. <td> ... </ td> tag to create a column / cell

4. colspan merge / expand column / cell

5. rowspan merge / widen line


Atribute tabel and fungsions


Tag
Atribut/Contoh penulisan
Fungsi
<table>
...
</table>
border=”...”
Ketebalan tabel.
Contoh:
<table border=”1”>

align=”...”
Pengaturan tabel (rata tengah, kanan atau kiri)

width=”...”
Lebar tabel. Bisa diisi dengan satuan pixel atau persen.
Contoh:
<table width=”80%”> atau
<table width=”600”>

valign=”...”
Perataan secara vertikal dari suatu cell.
(top, middle, bottom)

bordercolor=”...”
Warna border

bgcolor=”...”
Warna      background       tabel,
baris atau cell



In order for the cells in the tabell to be empty, then the command can be used & nbsp;


  So explanation of General Shape and Basic HTML Tag Function, apologize if there is error, easy to be useful, umpteen and thank you.


No comments :

Post a Comment