Belajar HTML yuk

Silahkan buka notepad anda.

Halaman web saya yang pertama

Ini halaman web saya yang pertama.

# Setiap dokumen HTML harus diawali dengan tag &lthtml> dan diakhiri dengan tag
# &lthead> dan digunakan sebagai informasi tentang dokumen kita.
# &lttitle> dan digunakan sebagai judul dari browser kita.
# &ltbody> dan digunakan sebagai isi dari halaman WEB kita.

Sekarang kita simpan text yang telah kita ketik misalnya dengan nama hal1.html
Sekali lagi jangan lupa akhiri nama file dengan .html
Selanjutnya kita buka Internet Explorter: klik gambarnya, kemudian File->Open->Browse, cari file dengan nama hal1.html kemudian Open dan OK.
Apa yang terjadi? Ternyata halaman WEB kita sudah bisa tampil sekarang, seperti dibawah ini.

contoh pertama

contoh pertama

Pada bab ini kita akan belajar membuat paragaf, heading, format text dan bentuknya.

1. Membuat Paragraf
Silahkan ketik di notepad seperti dibawah ini:

Menambah Text dan Formatnya

Ini baris pertama&ltp>
Dan ini baris ke tiga&ltbr>
Kalau ini baris ke empat&ltbr>

# &ltp> artinya pindah paragraf atau pindah dua baris
# &ltbr> artinya pindah baris
2. Membuat Heading
Silahkan ketik diantara dan seperti dibawah ini:

&lth1&gtHeading Pertama

&lth2&gtHeading Kedua

&lth3&gtHeading Ketiga

&lth4&gtHeading Keempat

&lth5&gtHeading Kelima

&lth6&gtHeading Keenam

# Terlihat bahwa besarnya tulisan tiap heading berbeda-beda.
3. Format Text dan Bentuknya
Silahkan ketik diantara dan seperti dibawah ini:

&ltstyle type=”text/css”>
body {font-family:”Arial”;font-size:”12pt”;color:blue}

&ltbody>
Ini &ltb>&lti>&ltu&gthalaman web saya

# &ltstyle> dan adalah bentuk, ukuran dan warna text.
# &ltb> dan adalah text yang ditebalkan.
# &lti> dan adalah text yang dimiringkan.
# &lti> dan adalah text yang digaris bawahi.

Tabel digunakan untuk menampilkan angka-angka dalam baris dan kolom, pada bab ini kita akan belajar bagaimana membuat tabel.

2. Membuat Tabel Sederhana
Silahkan ketik diantara dan seperti dibawah ini:

&lttable>
&lttr>&ltth&gtKolom 1

&ltth&gtKolom 2

&lttr>&lttd&gtBaris 2

&lttd&gtBaris 2

&lttr>&lttd&gtBaris 3

&lttd&gtBaris 3

# &lttr> definisi baris horisontal
# &lttd> definisi data sel dalam satu baris
# &ltth> definisi data sel pada judul tabel
2. Membuat Tabel Dengan Formatnya
Silahkan ketik diantara dan seperti dibawah ini:

&ltstyle type=”text/css”>
th {font-family:”Arial”;font-size:”12pt”;color:red}
td {font-family:”Tahoma”;font-size:”12pt”;color:blue}

Silahkan ketik diantara dan seperti dibawah ini:

&lttable with=”50%” border=”1″ rules=ALL>
&lttr>&ltth bgcolor=”silver”&gtKolom 1

&ltth bgcolor=”silver”&gtKolom 2

&lttr>&lttd align=”center”&gtBaris 2

&lttd align=”center”&gtBaris 2

&lttr>&lttd align=”center”&gtBaris 3

&lttd align=”center”&gtBaris 3

3. Membuat Tabel Lanjutan
Silahkan ketik diantara dan seperti dibawah ini:

&ltstyle type=”text/css”>
th {font-family:”Arial”;font-size:”12pt”;color:red}
td {font-family:”Tahoma”;font-size:”12pt”;color:blue}

Silahkan ketik diantara dan seperti dibawah ini:

&lttable with=”100%” border=”1″ rules=ALL>
&lttr>&ltth bgcolor=”silver” colspan=”2″&gtKombinasi kolom 1 dan kolom 2.

&lttr>&lttd&gtBa
>&lttd&gtBaris 2

&lttd rowspan=”2″&gtKombinasi baris 2 dan baris 3.

&lttr>&lttd&gtBaris 3

Pada bab ini kita akan membahas cara menghubungkan text atau web dokumen yang kita buat ke lokasi tertentu atau sering disebut dengan Hyperlinks.
Kita dapat menghubungkan text kita dengan file dan email lainnya, bisa juga kita hubungkan dalam halaman yang sama ataupun halaman yang berbeda.

1. Menghubungkan Text kita dengan file lain dan email lain
Silahkan ketik diantara dan seperti dibawah ini:

Silahkan &lta href=”hal1.html”&gtklik disini
Silahkan &lta href=”http://www.geocities.com/riyanto_its/html.html”&gtklik disini
Silahkan &lta href=”mailto:sigit@ece.ibaraki-ct.ac.jp”&gtklik disini

2. Menghubungkan Text Pada Halaman Yang Sama
Silahkan ketik diantara dan seperti dibawah ini:

&lth2&gtKlik tulisan bergaris untuk membaca text secara penuh

&ltbr>
&lta href=”#BS”>&lti&gtParagraf Satu&ltbr>
&lta href=”#BD”>&lti&gtParagraf Dua&ltbr>
&lth1&gtMembaca Artikel Penuh>/h1>&ltbr>
&lth2>&lta name=”BS”&gtParagraf Satu

&ltbr>
Ini tulisan pertama.&ltp>
Ini tulisan kedua.&ltp>
Ini tulisan ketiga.&ltp>
Ini tulisan keempat.&ltp>
Ini tulisan kelima.&ltp>
Ini tulisan keenam.&ltp>
Ini tulisan ketujuh.&ltp>
&lth2>&lta name=”BD”&gtParagraf Dua

&ltbr>
Ini tulisan pertama.&ltp>
Ini tulisan kedua.&ltp>
Ini tulisan ketiga.&ltp>
Ini tulisan keempat.&ltp>
Ini tulisan kelima.&ltp>
Ini tulisan keenam.&ltp>
Ini tulisan ketujuh.&ltp>
&lth2&gtKlik tulisan bergaris untuk membaca text secara penuh

&ltbr>
&lta href=”para1.html”>&lti&gtParagraf Satu&ltbr>
&lta href=”para2.html”>&lti&gtParagraf Dua&ltbr>

oke kurasa sekian CUkup kebersamaanya yach kasih komen yach kalo boleh hehehe

Pada bab ini kita akan membahas cara menghubungkan text atau web dokumen yang kita buat ke lokasi tertentu atau sering disebut dengan Hyperlinks.
Kita dapat menghubungkan text kita dengan file dan email lainnya, bisa juga kita hubungkan dalam halaman yang sama ataupun halaman yang berbeda.
1. Menghubungkan Text kita dengan file lain dan email lain
Silahkan ketik diantara <body> dan </body> seperti dibawah ini:

Silahkan &lta href=”hal1.html”&gtklik disini </a&gtuntuk membuka halaman pertama.&ltbr>
Silahkan &lta href=”http://www.geocities.com/riyanto_its/html.html”&gtklik disini </a&gtuntuk membuka web belajar HTML.&ltbr>
Silahkan &lta href=”mailto:sigit@ece.ibaraki-ct.ac.jp”&gtklik disini </a&gtuntuk mengirim email ke Sigit.&ltbr>

2. Menghubungkan Text Pada Halaman Yang Sama
Silahkan ketik diantara <body> dan </body> seperti dibawah ini:

&lth2&gtKlik tulisan bergaris untuk membaca text secara penuh</h2>&ltbr>
&lta href=”#BS”>&lti&gtParagraf Satu</i></a>&ltbr>
&lta href=”#BD”>&lti&gtParagraf Dua</i></a>&ltbr>
&lth1&gtMembaca Artikel Penuh>/h1>&ltbr>
&lth2>&lta name=”BS”&gtParagraf Satu</a></h2>&ltbr>
Ini tulisan pertama.&ltp>
Ini tulisan kedua.&ltp>
Ini tulisan ketiga.&ltp>
Ini tulisan keempat.&ltp>
Ini tulisan kelima.&ltp>
Ini tulisan keenam.&ltp>
Ini tulisan ketujuh.&ltp>
&lth2>&lta name=”BD”&gtParagraf Dua</a></h2>&ltbr>
Ini tulisan pertama.&ltp>
Ini tulisan kedua.&ltp>
Ini tulisan ketiga.&ltp>
Ini tulisan keempat.&ltp>
Ini tulisan kelima.&ltp>
Ini tulisan keenam.&ltp>
Ini tulisan ketujuh.&ltp>

&lth2&gtKlik tulisan bergaris untuk membaca text secara penuh</h2>&ltbr>
&lta href=”para1.html”>&lti&gtParagraf Satu</i></a>&ltbr>
&lta href=”para2.html”>&lti&gtParagraf Dua</i></a>&ltbr>

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: