4:54 PM
Shandy Dafitra
Ton 4/5/A
Penulis : Shandy
Dafitra Hasibuan,S.T
Nosis :
421
Tanggal 12 Oktober 2017
Pada pembelajaran pemrograman,
kami mempelajari tentang pengenalan dasar HTML,
HTML merupakan singkatan dari HyperText
Markup Language adalah script untuk menyusun dokumen-dokumen Web.
Kami mempelajari beberapa format html seperti structure html dasar. Untuk
membuat program tersebut Berikut latihan
pemrograman web yang kami buat dengan html :
Membuat file latihan1_1.html
Pada latihan ini kami akan
membuat seperti tampilan di bawah ini:
Untuk membuat tampilan seperti
diatas kita harus mengetikan script pada salah satu aplikasi pendukung
pembuatan program web seperti notepad, notepad++, sublime dan lain sebagainya,
pada latihan ini penulis menggunakan sublime text:
Listing Program:
<html>
<head>
<title>Latihan1-1</title>
</head>
<body>
Belajar bahasa pemrograman web ternyata mudah juga :)
</body>
</html>
<head>
<title>Latihan1-1</title>
</head>
<body>
Belajar bahasa pemrograman web ternyata mudah juga :)
</body>
</html>
Berikut penjelasan dari list program tersebut:
<html> ..</html> menyatakan pada browser bahwa
dokumen web yang digunakan adalah HTML, Element title Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela
browser. Tag <title> dan tag </title> terletak di antara tag
<head> dan tag </head>, <head>..</head> Merupakan kepala dari dokumen HTML yang terletak
di antara tag <html> dan tag </html>.
Selain latihan 1 ini kami mempelajari tentang
format text pada html seperti Element Break <BR>, Element paragraph,
element header, element font dan lain sebagainya.
Berikut salah satu contoh yang mewakili beberapa contoh yang
telah kami kerjakan dikelas berikut penjelasannya.
Source
code
Listing Program:
<html>
<head>
<title>Latihan1-4</title>
</head>
<body text="red"
bgcolor="aqua"
background="./img/IMG-20170801-WA0034.jpg">
Belajar bahasa pemrograman web ternyata
mudah juga :) <br>
<p>Paragraf ini pada posisi rata kiri
(default)</p>
<p
align="center">Paragraf ini pada posisi rata tengah</p>
<p align="right">Paragraf
ini pada posisi rata kanan</p>
<p
align="left">Paragraf ini pada posisi rata kiri</p>
<h1>Ini
Heading-1</h1>
<h2>Ini
Heading-2</h2>
<h3>Ini
Heading-3</h3>
<h4>Ini
Heading-4</h4>
<h5>Ini
Heading-5</h5>
<h6>Ini
Heading-6</h6>
<b><i><u>Ini
teks tercetak tebal (bold)</i></u></b><br>
<hr
align="left" size="6" width="30%">
<hr
align="left" size="6" width="30%" noshade>
</body>
</html>
Penjelasan dari list
program tersebut ialah:
Pada program diatas
tidak jauh beda dengan listing program diatas namun ada tambahan beberapa
element seperti penambahan gambar, element paragraph, pengaturan penulisan rata
kanan kiri dan tengah.
<body
text="red" bgcolor="aqua" background="./img/IMG-20170801-WA0034.jpg">
Belajar bahasa pemrograman web ternyata
mudah juga :) <br>
<p>Paragraf ini pada posisi rata kiri
(default)</p>
Pada listing program
diatas kita dapat melihat bahwa pada body tersebut kita menggantikan background
dari web yang kita buat.
<p
align="center">Paragraf ini pada posisi rata tengah</p>
<p
align="right">Paragraf ini pada posisi rata kanan</p>
<p
align="left">Paragraf ini pada posisi rata kiri</p>
Pada list di atas kita
dapat melihat bahwa program akan memunculkan paragraf dengan text rata tengah,
kanan, dan kiri
<h1>Ini
Heading-1</h1>
<h2>Ini
Heading-2</h2>
<h3>Ini
Heading-3</h3>
<h4>Ini
Heading-4</h4>
<h5>Ini
Heading-5</h5>
<h6>Ini
Heading-6</h6>
Pada listing coding
diatas digunakan untuk menentukan besar huruf text yang akan kita gunakan.
<b><i><u>Ini
teks tercetak tebal (bold)</i></u></b><br>
List berikut digunakan
untuk memberikan ketebalan kemiringan dan garis bawah pada text yang mungkin
perlu perhatian.
<hr
align="left" size="6" width="30%">
<hr
align="left" size="6" width="30%" noshade>
Dan yang terakhir list
code di atas untuk membuat sebuah garis lurus horisontal dengan ukuran 6 lebar
30 dan rata kiri.
0 comments:
Post a Comment