Pembelajaran PHP dan Pengenalan CSS

1. LAPORAN
Pemrograman Berbasis Web
Tugas Web (CSS)
disusun oleh :
Alfian Bayu Saputro
(1210651060)
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS MUHMMADIYAH JEMBER
2014

2. SOAL:
1. Ubahlah teks dalam list (kandungan susu) sehingga property font (warna, jenis font,
ukurannya sama dengan paragraf pertama)
2. Ubahlah teks dalam panel menu atas menjadi link dan ketika disorot dengan kursor, warna
teks dan background-nya berubah.
3. Isilah bagian sebelah kanan halaman (bagian berwarna biru) dengan suatu konten (misalnya
daftar artikel, dsb). Dan percantiklah dengan kreasi CSS anda (tidak ada CSS berarti juga
TIDAK ADA NILAI)
4. Tambahkanlah teks/ tulisan yang proporsional di bagian header halaman
5. Dibuat laporan ya, upload di slideshare.net dan URLnya disubmit di elearning.
Jawaban.
1. Pada tampilan web awalnya seperti ini :

3. • Isi teks di dalam list sebelum di edit
Kemudian tampilan di atas di ganti/ disamakan (font, warna ukurannya sama dengan paragraf
pertama) .
• Pertama, pastikan sudah menuliskan kode css. Agar bisa mengimpot file cssnya.berikut
linknya:
• Menyamakan CSSnya :
Ini tampilan Css paragraph pertama dengan format #isi p

4. Dan ini tampilan Css paragraf keduanya dengan format # isi li
• Hasilnya:
2. Mengubah teks paneh pada panel menu atas menjadi link, dan ketika di sentuh kursor.
• Pertama ubah isi cssnya
• Kedua pada htmlnya, tambahkan <a href=""> </a>

5. • Hasilnya
3. Mempercantik halaman sebelah kanan menggunakan css.
• Tampilan awal sebelum di kreasikan
• Pertama, membuat text, gambar pada html seperti di bawah ini.:

6. • Kedua , membuat css agar mempercantik text dengan menglink kan text
Awalnya sebelum di kreasi:
Setelah di kreasi:
• Hasilnya

7. • Pada bagian bawah header saya menambahkan tulisan berjalan , htmlnya :
• Hasilnya.
• Pada bagian footer saya juga menambahkan link bila di sentuh kursor akan berwarna.

8. Ini Css awalnya :
Dan ini tambahan css sebagia kreasi untuk mempercantik :
• Ini Htmlnya :
• Hasilnya
4. Tambah kreasi pada header
• Tampilan awal web dan htmlnya :
• Tampilan webnya:
• Tampilan html setelah di kreasi

9. • Tampilan css setelah di kreasi
• Hasilnya:
5. Setelah melakukan proses perbaikan dan penambahan tampilan dan hasilnya kini seperti: