Informasi

Sekian bahan untuk ulangan pertama komputer.
Silakan mendownload dan selamat mencoba.
Mohon maaf atas kesulitan mencoba dikarenakan sistem blog ini tidak memungkinkan untuk attach file dan juga kata kunci html tidak diizinkan. Maka saya buat agak sedikit rumit agar dapat diupload teman-teman.
Sekian dan terima kasih.

Contoh soal (piramida)

(HTML)
(head)PiRaMida
(title)Web Pertamaku
(/title)
(/head)
(BODY bgcolor="green" )
(p)Berapa Gariskah Dibawah ini?(/p)
(HR align="center" width=5% size=10 color="yellow")
(HR align="center" width=10% size=10 color="yellow" noshade)
(HR align="center" width=20% size=10 noshade)
(HR align="center" width=35% size=10 noshade)
(HR align="center" width=25% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=4% size=10 noshade)
(HR align="center" width=6% size=10 noshade)
(HR align="center" width=12% size=10 )



(/BODY)
(/HTML)

Contoh soal (latihan)

(HTML)
(head)
(title)
marquee
(/title)
(/head)
(body text=green)
(b)
(marquee direction=right width=400)(marquee direction=up-down width=400)(h1)BELAJAR MARQUEE(/h1)(/marquee)(/marquee)

(marquee direction=left behavior=slide width=200 height=100)(font color=red size=5)A(/font)(/marquee)

(marquee direction=right behavior=alternate width=200 height=100)(font color=yellow size=6)B(/font)(/marquee)

(marquee direction=up behavior=slide width=200 height=100)(font color=blue size=7)C(/font)(/marquee)

(marquee direction=down loop=10 width=200 height=500)(font color=magenta size=8)D(/font)(/marquee)

(marquee scrollamount=5000 behavior=alternate width=50 height=200)(font color=aqua size=9)E(/font)(/marquee)

(/body)
(/HTML)

Contoh soal (latihan2)

(HTML)
(head)PiRaMida
(title)Web Pertamaku
(/title)
(/head)
(BODY bgcolor="green" )
(p)Berapa Gariskah Dibawah ini?(/p)(center)

(MARQUEE behavior="slide" )
(HR width=5% size=10 color="yellow")(/MARQUEE)(br)

(MARQUEE behavior="slide" direction="right")
(HR width=10% size=10 color="yellow" noshade)(/MARQUEE)(br)

(MARQUEE behavior="slide" )
(HR width=20% size=10 noshade)(/MARQUEE)(br)

(MARQUEE behavior="slide" direction="right")
(HR width=23% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide")
(HR width=25% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide" direction="right")
(HR width=4% size=10 noshade)(/marquee)
(marquee behavior="slide")
(HR width=4% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide" direction="right")
(HR width=4% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide")
(HR width=4% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide" direction="right")
(HR width=4% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide")
(HR width=4% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide" direction="right")
(HR width=4% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide")
(HR width=6% size=10 noshade)(/MARQUEE)(br)
(MARQUEE behavior="slide" direction="right")
(HR width=12% size=10 )(/MARQUEE)(br)



(/BODY)

Contoh soal (latihan1)

(html)
(head)
(title)My CoMPuTeR(/title)
(/head)
(body text="yellow")



(font color="red" size="5")
(b)
(center)
(MARQUEE width="400" height="10" direction="right")SELAMAT DATANG
(/MARQUEE)
(/b)
(/center)
(/font)



(font color="green" size="3")
(center)
(marquee direction=right width=400)(marquee width=100)
(h1 align="center")Di Lab Komputer(/h2)
(/font)
(/marquee)
(/MARQUEE)
(/center)
(br)
(br)



(center)
(MARQUEE width="500" behavior="alternate")
(hr size=5 color=pink width=50% align=center)
(/marquee)
(br)
(br)
(/center)



(center)
(MARQUEE width="200" height="100" direction="up")
(font face=arial black color="blue")SMA KOLESE
(/font)
(/marquee)

(MARQUEE width="200" height="100" direction="down")
(font face='arial black' color="black")KANISIUS(/font)(/marquee)
(/center)


(br)
(font color="maroon" size="3")
(center)
(marquee scrollamount=50 behavior=alternate width=50 height=100)
(h1 align="center")Jakarta(/h2)
(/font)
(/marquee)
(/MARQUEE)
(/center)

























(font face= "Bradley Hand ITC" color="green" size="3")
(center)
(marquee behavior=alternate direction=down height=100 width=400)
(marquee behavior=alternate width=400)
(h1 align="center")ORA ET LABORA(/h2)
(/font)
(/marquee)
(/MARQUEE)
(/center)





(/body)
(/html)

Contoh soal (garis)

(html)
(head)
(title)
(/title)
(/head)
(body bgcolor=black)
(div align=center)

(hr width=100 size=10 color=red)
(hr width=200 size=10 color=yellow)
(hr width=300 size=10 color=green)
(hr width=400 size=10 color=red)
(hr width=300 size=10 color=yellow)
(hr width=200 size=10 color=green)
(hr width=100 size=10 color=maroon)

(marquee bgcolor=white behavior=scroll scrollamount=50 direction=left width=60)
(hr width=50 size=10 color=blue)
(/marquee)
(br)

(marquee bgcolor=aqua behavior=scroll scrollamount=50 direction=left width=60)
(hr width=50 size=10 color=blue)
(/marquee)
(br)

(marquee bgcolor=orange behavior=scroll scrollamount=50 direction=left width=60)
(hr width=50 size=10 color=blue)
(/marquee)
(br)

(marquee bgcolor=magenta behavior=scroll scrollamount=50 direction=left width=60)
(hr width=50 size=10 color=blue)
(/marquee)
(br)

(hr width=50 size=10 color=blue)
(hr width=50 size=10 color=blue)
(hr width=50 size=10 color=blue)
(hr width=50 size=10 color=blue)
(hr width=50 size=10 color=blue)


(/body)
(/html)

Contoh soal (Coba2)

(HTML)
(HEAD)
(TITLE)Atribut NOSHADE pada Tag HR(/TITLE)
(/HEAD)
(BODY background="garnet3.jpg")
(H1 align="right")NHeea Ardianing(/H1)
(HR align="left" color=red SIZE = "50" width="1000")
Jl. Solo Km 14(BR)
Yogyakarta(BR)
Indonesia(BR)
(/BODY)
(/HTML)

Contoh soal (Coba1)

(HTML)
(HEAD)
(TITLE)Latihan Pertama(/TITLE)
(/HEAD)
(BODY text=red)

(h1 align="left")Selamat (/h1)

(font color=green)
(h2 align="right") Belajar (/h2)
(/font)

(h3 align="center")HTML(/h3)

(font color=blue)
(h4 align="justify")di Lab Komputer(/h4)
(/font)

(h5)(u)Selamat Belajar HTML(/h5)(/u)

(font color=aqua face='Arial black')
(DIV ALIGN = "RIGHT")
(h6)Selamat Belajar HTML(/h6)
(/div)
(/font)

(font color=magenta face=Arial black)
(h7)(i)Selamat Belajar HTML(/h7)(/i)
(/font)

(/BODY)
(/HTML)

Bahan Ulangan Komputer 2

• FORMAT TEXT
– Cetak Tebal à(b)….teks…(/b)
– Cetak miring à (I)….teks….(/I)
– Cetak Garis bawah à (u)….teks…(/u)
– Mengecilkan huruf à (small)….teks…(/small)
– Membesarkan huruf à (big)…teks….(/big)
– Teks yang ditebalkan(sama dgn (b))à (strong)…..teks…..(/strong)
– Penekanan teks menjadi huruf miring (sama dgn (I)) à (emphasis)…teks…(/emphasis)
– Mencoret teks à (strike)….teks….(/strike)
– Subscript dan superscript à (sub)……teks….…(/sub) dan (sup)……..teks….…(/sup)
– Preformated text/pre à (pre)………..teks………….(/pre)
– Akronim/acronym
(acronym [properti])………….teks…….(/acronym)
properti à title adalah mendefinisikan singkatan yang digunakan
– Quotation panjang/blockquote(kutipan panjang)
(blockquote)………..teks………..(/blockquote)


LIST HTML

List adalah sebuah uraian yang terdiri atas item-item dari suatu daftar yang dilengkapi dengan nomor baik nomor alpabetik atau numerik. Dalam dokumen terdapat dua bentuk daftar atau list, yaitu:

1. Ordered List / List Bernomor

Model dari suatu daftar yang setiap itemnya diberikan nomor. Sintaksnya:
(ol [properti])
(li)........isi list...........
(li)........isi list...........
(li)........isi list...........
(/ol)
Keterangan :
- Tag OL diambil dari nama bentukàOrdered List.
- Atribut berisi type atau start / mulai penomoran list.
- Ada empat bentuk type: a, A, i, I.

2. Unordered List / List Tanpa Nomor
Model dari suatu daftar yang setiap itemnya tidak diberikan nomor, akan tetapi digantikan dengan bulleted list. Sintaksnya:
(ul [properti])
(li)........isi list..........
(li)........isi list...........
(li)........isi list...........
(/ul)
Ket:
- Tag OL diambil dari nama bentukàOrdered List.
- Atribut berisi type atau start / mulai penomoran list.
- Ada tiga bentuk type: disc(l), square(n), circle(¡).

Contoh –Contoh Halaman Web:
Buatlah contoh-contoh di bawah ini :
text.html
ol.html
ul.htm
Img.html
link.html

Bahan ulangan komputer1

Ket : untuk lambang <, diganti (.
untuk lambang >, diganti ).
Jadi, nanti di Microsoft Word, pencet Ctrl+F, lalu replace ( dengan < dan )
dengan >. Selesai deg. Untuk yang berikutnya, gitu ya. Thanks.
-------------------------------------------------------------------------------------
1. Pengenalan HTML
• HTML adalah kependekan dari Hyper Text Markup Language.
• Yang artinya Bahasa atau tata cara penulisan yang digunakan dalam membuat dokumen web.
• HTML secara formal diumumkan tahun 1866 sebagai RFC(Request For Comment) dokumen yang dikirim oleh lembaga internet yang berisi informasi atau usulan yang berhubungan dengan standar internet.
2. Dokumen HTML adalah sebuah dokumen teks murni yang dapat dibuat dengan text editor web seperti :
• Frontpage,
• Dreamweaver,
• Notepad,
• Wordpad,
• Kwrite,
• Microsoft Word
3. Browser Web adalah program yang digunakan untuk menampilkan informasi dari suatu halaman web yang tersimpan dalam komputer, seperti :
• Internet Explorer
• Mozilla
• Opera
• Netscape Navigator
• dll…..
4. Penamaan dokumen html
• File disimpan secara default atau secara otomatis akan diberikan sebuah extention atau akhiran
• Untuk dokumen html disimpan dengan menggunakan extention :
.html atau .htm
5. Struktur Dasar Dokumen HTML
• (html)
• (head)
• (title)… teks ...
• (/title)
• (/head)
• (body)
• … teks …
• (/body)
• (/html)
6. Pengertian-Pengertian:
• Elemen yang telah diapit oleh tanda ( ) disebut tag.
• Tag dasar :(html)(head)(title)dan (body)
• Simbol batasan awal dan akhir atau tanda ( ) disebut delimiter.
• Section Head berfungsi untuk menampilkan informasi judul pada jendela browser atau halaman web.
• Section Body berfungsi untuk menampilkan isi/informasi pada halaman web.
• Properti adalah perintah tambahan yang dimiliki oleh tag
7. Tag atau elemen terdiri dari dua macam yaitu :
• Container Tag menandai suatu bagian dari dokumen diawal dan diakhir.
Contohnya:
(body)…(/body)
(p)…(/p)
• Stand Alone Tag tidak memerlukan tanda awal dan akhir.
Contohnya:
(hr)
(img src)
8. Properti-Properti Tag Dasar (body):
• Alink=“warna” à warna link(aktif)
• background=“nama_file/url” à berupa image
• bgcolor=“warna” àberupa warna
• link=“warna” à warna link(umum)
• text=“nama warna” àwarna text
• vlink=“nama warna” à warna link(sudah dikunjungi)
9. Tag utama html adalah tag yang digunakan untuk memanipulasi dokumen html, yaitu:
1.Heading
Tag heading adalah tag yang digunakan untuk membuat judul dari isi sebuah dokumen html. Tag heading memiliki 6 buah bilangan terdiri dari 1, 2, 3, 4, 5, dan 6.
Masing2 bilangan berfungsi untuk mewakili ukuran terbesar(H1) dan terkecil(h6).
Sintaksnya:
(hn[properti])……………..(/Hn)
ket:
n adalah bilangan yang terdiri dari 1 sampai dengan 6.
properti adalah kemampuan tambahan yang dimiliki tag heading.
Properti à align adalah pengaturan letak heading
2. Paragraf
Sintaks:
(p[properti])…………….(/p)
ket:
propertià align adalah pengaturan letak paragraf(center, left, right, dan justify).
3. Font
Tag yang digunakan untuk mengatur bentuk dan tampilan suatu huruf dalam dokumen.Sintaksnya:
(font[properti])…………….(/font)
properti à face adalah bentuk tulisan dan nama huruf
size adalah ukuran huruf
color adalah warna huruf
4. Break line
Tag yang digunakan untuk memotong kalimat didalam dokumen html.
Sintaksnya:
……kalimat……(br)……….kalimat………….(br)
5. Horizontal line
Tag yang digunakan untuk pemisah/garis antar paragraf dalam dokumen html.
Sintaksnya:
(hr[properti])
ket:
properti à align adalah letak garis(center, left, right dan justify)
size adalah ukuran ketebalan, defaultnya 2.
width adalah lebar garis, satuanya dalam pixels atau persen
color adalah warna garis
noshade adalah efek bayangan (shading)
6. Marquee
Adalah sebuah text berjalan pada dokumen html. Sintaksnya:
(marquee[properti])………isi/text marquee….(/marquee)
ket:
properti à behavior adalah cara atau teknik dari marquee untuk berjalan(scroll, slide, dan alternate.
Direction adalah arah teks berjalan(left, right)
Height adalah tinggi marquee nilainya dlm presentase/pixels
Width adalah lebar marquee nilainya dlm persetase/pixels
Continously adalah pengulang teks secara terus menerus, nilainya adalah loop sebanyak n kali.
Bgcolor adalah warna background marquee.
Style adalah untuk memformat font, paragraf, border, numbering dan position.
• Contoh –Contoh Halaman Web:
Buatlah contoh-contoh di bawah ini :
• coba1.html
• coba2.html
• latihan1.htm
• latihan2.html
• piramida.html