General Shape and Basic HTML Tag Functions
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:
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!
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:
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
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.
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.
