Jurnal : Web Design with CSS

advertisement
Jurnal : Web Design with CSS (minggu 4)
How to…?
Petunjuk :
1. Semua soal wajib untuk dikerjakan, di kertas ukuran A4 (print out atau tulis tangan).
2. Gunakanlah salah satu dari 3 cara penerapan CSS untuk menjawab soal, dengan membuat jawaban selengkap
mungkin (file .html beserta .css nya bila diperlukan)
3. Tuliskan No.Kelompok, Kelas, Nama dan Nim pada lembar jawaban.
4. Anda bisa gunakan ebook Sitepoint : “The CSS Anthology: 101 Essential Tips, Tricks & Hacks”, sebagai
referensi untuk menjawab soal.
Contoh Soal:
Bagaimana cara membuat blok paragraph dengan ukuran huruf “sedang”, berjenis “Arial”, dan berwarna?
Contoh Jawaban:
<html>
<head>
<title>Soal1</title>
<style>
#paragraph {
font : “Arial” 13px;
color : #FF0000;
}
</style>
</head>
<body>
<div id=”paragraph”>
Tes tulisan untuk membuat paragraph yang sesuai dengan keinginan kita. Ternyata
CSS itu tidak sesulit yang dibayangkan. Coba saya tau ini dari kecil…
</div>
</body>
</html>
Soal 1.
Bagaimana Cara membuat satu paragraph dengan ukuran huruf sedang, jenisnya Tahoma, ada jarak
antar vertical (spasi), dan tulisan rata kanan.
Sedangkan paragraph keduanya memiliki jarak antar vertical (spaci) yang lebih lebar, dan semua huruf
nya menjadi Capital.
Dan untuk Paragraph ketiga, sama style nya dengan paragraph pertama. Hanya saja jika dilewati oleh
cursor mouse (hover), maka style nya akan seperti paragraph kedua.
Soal 2.
Bagaimana cara membuat Menu Link/Navigasi secara horizontal menggunakan TAG List. Dan setiap
Menu Navigasi itu memiliki submenu yang ditampilkan dengan tehnik drop-down menu.
Soal 3.
Bagaimana cara membuat Layout web yang memiliki 3-Column (horizontal) lengkap dengan header
dan footer, menggunakan CSS (tanpa Table). Sekaligus sertakan contoh Link Menu dan isi Content
nya, pada layout tersebut.
Telkom Polytechnic | Web Programming - TFN
Download