Hai … kali ini saya
kembali dengan postingan terbaru saya, yaitu Kumpulan Sintak Dasar HTML.
Silahkan di coba J.
Sebelum memulai mengetik sintak .html, buka dulu
aplikasi untuk coding seperti notepad atau boleh juga notepad++,Sublime text
dll.
1.
Yang pertama cara
membuat judul halaman web :
<HTML>
<HEAD>
<TITLE>Membuat
Judul Halaman Web</TITLE>
</HEAD>
<BODY>
Ini Judul Web
Saya
</BODY>
</HTML>
Setelah itu klik file save atau tekan tombol ctrl+s untuk
menyimpan, ubah format file menggunakan .html
setelah itu klik save/simpan contohnya : membuat judul halaman web.html.
Kemudian buka file yang di simpan tadi dengan cara klik kanan mouse lalu pilih
open with google chrome atau boleh juga menggunakan browser lainnya seperti mozilla
firefox, internet explorer dll. Jika telah terbuka anda akan melihat tampilan
“Membuat Judul Halaman Web” pada layar anda.
2.
Ke-2 cara mengatur ketebalan huruf :
<HTML>
<HEAD>
<TITLE>Mengatur
Ketebalan Huruf</TITLE>
</HEAD>
<BODY>
<b>Kalimat
ini menggunakan cetak tebal</b>
<i>
Kalimat ini menggunakan cetak miring</i>
<u>
Kalimat ini menggunakan cetak garis bawah</u>
<sub> Kalimat
ini menggunakan format di bawah garis atau subscript</sub>
>sup>
Kalimat ini menggunakan format di atas garis atau superscript</sup>
</BODY>
</HTML>
3.
Ke-3 membuat perataan paragraph :
<HTML>
<HEAD>
<TITLE>Membuat
Perataan Paragraf</TITLE>
</HEAD>
<BODY>
<p
align=”right”>Ini Menggunakan Rata Kanan</p>
<p
align=”left”>Ini Menggunakan Rata Kiri</p>
<p
align=”center”>Ini Menggunakan Rata Tengah</p>
<p
align=”justify”>Ini Menggunakan Rata Kanan Kiri</p>
</BODY>
</HTML>
4.
Membuat Tulisan
Bergerak :
<HTML>
<HEAD>
<TITLE>Membuat
Tulisan Bergerak</TITLE>
</HEAD>
<BODY>
</marquee>Tulisan
Ini Bisa Bergerak Lho..</marquee>
</BODY>
</HTML>
5.
Mengubah Warna & Memasukan Gambar Pada Halaman/Background
:
<HTML>
<HEAD>
<TITLE>Mengubah
Warna & Background Pada Halaman </TITLE>
</HEAD>
<BODY>
<body
bgcolor=”pink”> {tag tersebut untuk
mengubah warna backround,jika hendak
menggantinya dengan gambar, pertama-tama letakkan
gambar
yang akan di guakan satu folder dengan file html
dengan
mengubah tag <body bgcolor=”..” menjadi
<body background=”….”> seperti }
<body
background=”37.jpg”> {format gambar
pada html harus di sesuaikan dengan
gambar yang akan di gunakan seperti .jpg, .jpeg,
.png}
</BODY>
</HTML>
6.
Mengubah Font dan Warna Tulisan :
<HTML>
<HEAD>
<TITLE>Mengubah
Font &Warna Tulisan </TITLE>
</HEAD>
<BODY>
<font
face=”arial” size=”4” color=”blue”>
Tulisan Ini
Menggunakan Font Arial, Ukuran 4 dan Warna Biru
</BODY>
</HTML>
7.
Mengubah Ukuran Font dengan Menggunakan Heading :
<HTML>
<HEAD>
<TITLE>Latihan
Heading </TITLE>
</HEAD>
<BODY>
<H1>Ini
Menggunakan Heading 1</H1>
<H2>Ini
Menggunakan Heading 2</H2>
<H3>Ini
Menggunakan Heading 3</H3>
<H4>Ini
Menggunakan Heading 4</H4>
<H5>Ini
Menggunakan Heading 5</H5>
<H6>Ini
Menggunakan Heading 6</H6>
<H7>Ini
Menggunakan Heading 7</H7>
</BODY>
</HTML>
8.
Menyajikan Pembuatan List/Daftar :
List yang paling sering di pakai adalah
Ø Ordered List =
di awali dengan tag <ol>…</ol>, berisi tipe penomoran seperti
1=>1,2,3.. ,A=>A,B,C… ,a=>a,b,c… ,I=>I,II,III,IV…
,i=>i,ii.iii,iv…
Ø Unordered List
= diawali dengan tag <ul>..</ul>, berisi tipe tanda seperti type
circle,type disk,dan type square.
Contohnya :
<HTML>
<HEAD>
<TITLE>Membuat
List</TITLE>
</HEAD>
<BODY>
Di Bawah Ini
Menggunakan Ordered List :
<ol
type=1>
<li>Buah
<li>Sayur
<li>Lauk
Pauk
</ol>
Di Bawh Ini
Menggunakan Unordered List :
<ul
type=square>
<li>Paris
<li>Dubai
<li>Indonesia
<li>Korea
Selatan
</ul>
</BODY>
</HTML>
9.
Memasukkan Gambar :
Sama seperti mengganti background, simpan terlebih dahulu
gambar yang akan di upload pada folder yang sama dengan file .html.
<HTML>
<HEAD>
</TITLE>Memasukan
Gambar</TITLE>
</HEAD>
<BODY>
Saya Meng-upload
gambar pohon
<img
src=”pohon3.jpg” width=”300”
height=”400”>
</BODY>
</HTML>
10.
Membuat Hyperlink :
<HTML>
<HEAD>
</TITLE>Membuat
Hyperlink</TITLE>
</HEAD>
<BODY>
<a href=”membuat judul halaman web.html”>Kembali Keawal
Halaman</a>
</BODY>
</HTML>
Itu
tadi sedikit ilmu yang saya pelajari, semoga bermanfaat untuk para viewers
sekalian. Jangan lupa tinggalkan komentar.dan Selamat Mencoba. Terima Kasih
Tidak ada komentar:
Posting Komentar